We've got news for you in regards to Maglr single page embeds (and not to be confused with the embed element). Under the hood, we have transitioned from iFrames to inline web components. We'll have to get a bit technical to understand the differences.

Embedding Maglr publications and pages

If you've never used a Maglr project or page as an embed before, you're missing out. Embedding Maglr creations is another way to draw attention to your content. Here are just some of the advantages:

• Embeds can be viewed without the need to go to an external link or download a file
• The embed codes work with every CMS and can be used as an extension of your website builder
• Your embeds can be managed from within Maglr and are always up to date with the latest version

To learn more on how to get started with Maglr embeds in general, be sure to either refer to the help docs or read our blog "4 ways to use interactive embeds within your website".

iFrames vs. web components: what is it and why switch?

Let's get technical. If that doesn't sound like anything that interests you, feel free to skip ahead to see what has changed and what's in it for you.

In embedding Maglr pages, we've been using iFrame technology. Long story short, iFrames come with several drawbacks:

• An iFrame creates another window (HTML document) in your existing browser window and may result in unwanted scrollbars and bad user experience
• The contents of an iFrame are isolated, meaning they're not part of the parent document and therefore it may not be affected by parent styles or optimised for search engines (SEO)
• Can slow down page performance as your browser needs to load multiple documents instead of just one

Luckily for us, there's an alternative called "web components". It uses a custom "tag" instead of an iFrame which allows for the following merits:

• Embedded content seamlessly integrates into your page, providing a much smoother user experience
• Components simply scale better on various devices, improving responsiveness
• The embed becomes part of your page's code, meaning it can better indexed by search engines and can inherit (but not alter) styles from the overarching web document
• Web components will not block or slow down the initial page render, meaning that performance improves significantly

If you were to inspect the embed in the browser and compare them side-by-side, you'll find that the <iframe /> tag has changed into a <maglr-embed /> tag—indicating a custom web component. There may not be an obvious difference, but under the hood the technique of your embeds has completely changed, providing you with all the aforementioned benefits.

Important notes

• This update is only for single page embeds created with the Pro editor, meaning standalone visuals and pages (landing pages, infographics, banners, and so on).
• Prefer the iFrame version? Not to worry, the "legacy" iFrame version is still available.