Overlay embed
Open a story or publication fullscreen on top of your website
The overlay embed works with an iFrame and can be used for a single page of complete publication. The text and colors of the above 'banner' are configurable. The overlay animation is triggered by the embed itself. No additional code is required.
Try this embed
<div data-maglrEmbed="7wigeuesdv" data-type="banner" style="position:relative; width:auto; padding: 0 0 56.25%; ;"><iframe src="https://embed.maglr.com/7wigeuesdv?nav=3301&banner=1" frameborder="0" style="position:absolute;width:100%;height:100%;" allowfullscreen></iframe></div><script type="text/javascript" src="https://embed.maglr.com/assets/embed/js/embed.min.js" ></script>
iFrame embed
Include a publication with a minimal navigation in your blog
The navigation types and sizes of the iframe are configurable.
Try this embed
<iframe src="https://embed.maglr.com/7wigeuesdv?nav=minimal" width="100%" height="500" seamless="seamless" scrolling="yes" frameborder="0" allowtransparency="true" allowfullscreen ></iframe>
Embed single page (iframe)
Embed single page from publication (responsive on mobile)
A single page, without navigation, embedded with an iframe. Scales proportionally within the available space of the parent container.
Try this embed
<div data-maglrEmbed="tcix7fm7im" data-type="fullHeight" style="position:relative; width:auto; padding: 0 0 56.25%;;"><iframe src="https://embed.maglr.com/tcix7fm7im" frameborder="0" style="position:absolute;width:100%;height:100%;" allowfullscreen></iframe></div><script type="text/javascript" src="https://embed.maglr.com/assets/embed/js/embed.min.js" ></script>
Embed longread infographic (Web component inject)
Longread page using the Web component JS inject methid
This embed places itself in the available horizontal space of the parent container and scales the vertical length proportionally. When the screen gets smaller the mobile version of the embed is activated. This version is not using an iFrame. The story is becoming a part of the parent page structure, improving SEO.
Try this embed
<script type="text/javascript" src="https://embed.maglr.com/orpeyxavrj"></script><maglr-embed maglrid="orpeyxavrj" size="in-ratio" ></maglr-embed>