Embed Code

Technical & Infrastructure

An HTML snippet (usually an iframe tag) that displays a flipbook on any external website.

Definition

An embed code is a snippet of HTML — typically an [iframe](/glossary/iframe) tag — that you paste into a webpage's source code to display external content inline on that page. For digital publishing, embed codes load a flipbook or document viewer directly within the host page, so readers interact with the publication without navigating away. The content itself is served from the publishing platform's servers, meaning no file hosting is required on the destination site. When the source publication is updated, every embedded instance reflects the change automatically.

Why It Matters

Embed codes bridge the gap between your publications and your web presence. Without them, the only way to share a flipbook is through a direct link, which forces readers to leave your site. Embedding keeps visitors on your domain, improves behavioral metrics like time on page, and creates a seamless reading experience. It also centralizes content management: update the PDF once, and every embed across every website shows the latest version. This is especially valuable for catalogs, price lists, and menus that change frequently.

How It Works in FlipLink

FlipLink generates a ready-to-use embed code for every published flipbook or document. From the [sharing and distribution](/features/sharing-and-distribution) panel, you copy the iframe snippet and paste it into any website, blog, or CMS that accepts HTML. The embed is [responsive](/glossary/responsive-embed) by default, adapting to the container width on desktop and mobile screens. FlipLink also offers a [clickable image embed](/features/clickable-image-embed) option that displays a static thumbnail linking to the full flipbook — useful for email newsletters or platforms that restrict iframes. You can control where your content appears using [domain whitelisting](/glossary/domain-whitelisting), which restricts embedding to approved domains only.

Technical Details

An embed code consists of a few key parts: - **The iframe tag**: The core element that creates a window into the external content. It includes a `src` attribute pointing to the publication URL, plus `width` and `height` attributes for sizing. - **Responsive wrapper**: A surrounding `div` with percentage-based sizing ensures the iframe scales with the page layout. FlipLink's embed code includes this wrapper by default so you do not need to write your own CSS. - **Allow attributes**: Modern browsers require explicit `allow` attributes for features like fullscreen. FlipLink's embed code includes these so all interactive features work out of the box. - **Fallback content**: A text link inside the iframe tag serves as a fallback for the rare browsers or email clients that do not support iframes. The embed loads asynchronously, meaning it does not block the host page from rendering. Page performance impact is minimal because the flipbook viewer initializes only when the iframe becomes visible in the viewport.

Frequently Asked Questions

**What is an embed code?** An embed code is an HTML snippet you paste into your website to display content hosted on another platform. For flipbooks, it typically creates an iframe that loads the interactive publication viewer directly on your page. **Can I embed a flipbook on any website?** Yes, as long as the website allows custom HTML. This includes WordPress, Shopify, Squarespace, Wix (via HTML embed blocks), and any custom-built site. Some platforms like email clients do not support iframes — for those, use FlipLink's clickable image embed instead. **Does the embed code update automatically when I change the publication?** Yes. Because the embed code points to the publication URL on FlipLink's servers, any updates you make — replacing the PDF, changing settings, or updating CTA buttons — are reflected immediately in every embedded instance without touching the embed code on your site.

Setup Checklist

1. Publish your flipbook or document in FlipLink 2. Open the sharing panel and copy the embed code 3. In your website's CMS or page editor, add a custom HTML block 4. Paste the embed code into the HTML block 5. Preview the page to confirm the flipbook renders correctly on both desktop and mobile 6. If you want to restrict where the flipbook can be embedded, configure [domain whitelisting](/glossary/domain-whitelisting) in your publication settings 7. Test interactive features (page flip, CTA buttons, [lead capture](/glossary/lead-capture)) in the embedded version to verify they work as expected

Related Terms

Available in other languages

Ready to Transform
Your PDFs?

Join thousands of businesses using FlipLink to create engaging, interactive content from their PDFs. Start free — no credit card required.