Iframely iFrame helpers
Iframely comes with optional iFrames served from our CDN. By default, we wrap publisher's embed codes into hosted iFrame only when required. You can request our iFrames for all content, or disable each wrapper fallback that may be used.
Our iFrame helper is a fixer. It fixes publisher's issues, delivers security, performance, better and more consistent user experience and all of our HTML options.
Iframely knows rich media from over 1900 domains and it might be overwhelming to keep up with their inconsistencies. Our iFrame helpers resolve it for you. Besides, iFrames will update the rich media embed codes they contain in the background, so that you don't have to deal with it yourself.
iFrames are the part of the API and usage hits are registered the same way. As it might generate a bigger number of hits, our default API settings activate iFrame when required for edge cases only.
Hosted iFrames help with following technical features.
- Async load
- Our iFrames are non render-blocking iFrames. They load empty, fire
loadevent instantly, and, only after that, they start rendering the content.
- 3rd party scripts
- If your system engine doesn't easily allow arbitary 3rd party scripts (for example, React), we can wrap such embeds into iFrame and give you a single embed.js script that you need to make an exception for. Embed.js script is available on GitHub if you wish to self-host.
- Predictive height
- Iframely predicts height of scripted widgets such as Twitter, Facebook and Instagram so that the content on your page does not jump around while media loads. Our iFrames adjust height to exact actual value when it becomes known.
- By default, we wrap embed codes that we know are not SSL-friendly into our iFrame. That way our iFrames will present the actual non-SSL media on HTTP websites, and fall back to our summary card if embedded over SSL.
- Flash on mobile
- Similarly to SSL, we will wrap Flash embeds into our iFrame and show a summary card instead on devices that don't have it installed.
- Iframely iFrames keep updating URLs in the background so that you do not need to re-cache embed codes on your own.
- Web components
- While we keep calling it "iFrames", at times we will actually use Shadow DOM and imports in browsers that support it to bulk-insert web components instead of iFrames. It makes widgets load even faster. You can disable this upgrade in your settings or via
All of Iframely renders for HTML helpers we offer are delivered via hosted iFrames.
- Summary as URL previews and/or media cards which also contain a media attachment.
- iFrames and embeds formatted for Accelerated Mobile Pages and with proper event model.
- A placeholder with "play" button which loads players just when user requests it. Publishers that autoplay their videos are served only via click-to-play, plus, we can try the same approach for any publisher. Our iFrames start pre-fetching players as user moves her mouse towards the "play" button. This way, the loading of players is perceived to be in a snap.
- MP4 player
- If publisher give a raw MP4 file, we wrap it into our MP4 player. The design can be changed through "Click-to-play".
- Iframely uploads GIF files and transcodes them into smaller auto-looping MP4 files. Direct links to other image files also make us to upload those images to avoid hot-linking.
- Player events
- Playback sync
- Iframely will try and stop any playing videos if a user starts interacting with another one.
- Lazy-loading can be applied just for players through your settings. We will instantly show an image placeholder right away. Then swap it with actual player once it is loaded.
How iFrame helpers are sourced
Iframely handles millions of frame-views a day via our fast global content-delivery network. You can also bring your own CDN.
The iFrames with Content IDs will keep available even if you decide to cancel your subscription. To turn Content IDs on, check the box on your iFrames settings page.
How to activate iFrame helpers
API settings, however, provide configuration when to use iFrames in a more flexible way. For example, prevent certain domains from being wrapped into hosted iFrame or only use iFrames when an HTML helper or a summary card are required.
If you'd rather not get any iFrames at all, you may use
iframe=0 with your API calls to disable any helpers.