- These are general guidelines only and we offer them only to be helpful.
- We do not officially support these methods as their effectiveness may change over time.
- As website designs and layouts differ, we cannot provide exact embed code for you. Adjustments to any iframe embed code to achieve your desired effect are your responsibility. See the recommendations at the bottom of this article for some general guidelines.
- Browsers by default will block 'mixed content'. In this case, that would included HTTP Flipbooks delivered via an iframe on an HTTPS site, unless an end user takes action to allow the content to load. Flipbooks by default are HTTP but if you are interested in using HTTPS to avoid that issue, please contact support.
Embed using iframe
You can use a simple iframe HTML code to embed your Flipbooks onto your website.
This can keep users on your webpage and allow them to browse your Flipbook content without opening another window or tab.
Example 1 - Issue Link
Take the Issue URL http://goingdigital.uberflip.com/i/85628, for example.
The embed code could look like:
<iframe src="http://goingdigital.uberflip.com/i/85628" scrolling="no" style="overflow:hidden;width:100%;height:100%" webkitallowfullscreen mozallowfullscreen allowfullscreen><p>your browser doesn't support frames</p></iframe>
Example 2 - Folder/Title Link
Always have your latest Flipbook (by Publish Date) display in your iFrame by using the Folder link in your embed code.
In our example above, the URL for the folder is: http://goingdigital.uberflip.com/t/10418.
The embed code would be the same, except for the URL:
<iframe src="http://goingdigital.uberflip.com/t/10418" scrolling="no" style="overflow:hidden;width:100%;height:100%" webkitallowfullscreen mozallowfullscreen allowfullscreen><p>your browser doesn't support frames</p></iframe>
-We recommend the parameter scrolling="no" be set within the iFrame to ensure devices display embedded content in the correct height on mobile devices.
-We recommend using the parameter style="overflow:hidden" to ensure scroll bars are not displayed.
-Include the parameters webkitallowfullscreen mozallowfullscreen allowfullscreen in your iframe code to ensure the HTML 5 Flipbook's Full Screen option will work when you are embedding Flipbooks in iFrames.