How to Embed a Flipbook in Your Wix Website

Wix makes it easy to build a polished website without writing code, but adding interactive content like a flipbook can feel tricky at first. The good news is that embedding a FlipLink flipbook on your Wix site takes just a few minutes — no coding experience required.

In this guide, you'll learn how to grab your embed code from FlipLink, drop it into the Wix editor, and fine-tune it so your flipbook looks great on every screen size.

Why Embed a Flipbook on Your Wix Site?

Static PDFs buried behind download links don't engage visitors. An embedded flipbook lets people flip through your content directly on the page with realistic 3D page-turn animations. That means:

• Higher engagement — visitors interact with your content instead of navigating away to a PDF viewer
• Longer time on page — interactive elements keep people browsing
• Professional presentation — catalogs, portfolios, magazines, and brochures look far more polished as flipbooks
• No downloads required — everything loads right in the browser

Whether you're showcasing a product catalog, a company report, or a digital magazine, embedding beats linking every time.

What You'll Need

Before you start, make sure you have:

1. A FlipLink account with at least one published flipbook (sign up here if you haven't already)
2. Access to the Wix Editor for your website
3. Your flipbook's embed code or share URL from FlipLink

That's it. No premium Wix plugins or third-party apps are necessary.

Step 1: Get Your Embed Code from FlipLink

First, grab the embed code for the flipbook you want to display.

1. Log in to your FlipLink dashboard at go.fliplink.me
2. Open the flipbook you want to embed
3. Click the Share button in the toolbar
4. Select the Embed tab
5. Copy the iframe embed code provided

The embed code looks something like this:

<iframe
  src="https://go.fliplink.me/view/your-flipbook-id"
  width="100%"
  height="600"
  frameborder="0"
  allowfullscreen
></iframe>

FlipLink gives you a ready-to-use iframe snippet, so you won't need to construct anything manually. For a deeper look at embed options, check out the Sharing & Distribution feature page.

Step 2: Add an HTML Embed Element in Wix

Now switch over to your Wix site editor.

1. Open the Wix Editor for your site
2. Navigate to the page where you want the flipbook to appear
3. Click the Add (+) button in the left toolbar
4. Select Embed Code from the menu
5. Choose Embed HTML
6. A grey HTML widget will appear on your canvas — drag it to the desired position on the page

This widget is where your flipbook will live.

Step 3: Paste the Embed Code

1. Click on the HTML embed widget you just placed
2. Select Enter Code
3. Make sure the mode is set to HTML (not a URL)
4. Paste the iframe embed code you copied from FlipLink
5. Click Update or Apply

Your flipbook should now render inside the widget. You'll see the interactive viewer directly in the Wix editor preview.

Step 4: Resize and Position the Flipbook

The default iframe dimensions might not match your page layout perfectly. Here are some tips for getting the sizing right:

Set a Good Height

A height of 500–700 pixels works well for most flipbooks. If your content is landscape-oriented (like a catalog spread), go taller — around 650–700px. For portrait documents, 500–600px is usually sufficient.

Make It Full Width

To make the flipbook stretch across the content area, set the widget width to match your page's content column. In the Wix editor, drag the edges of the HTML widget to fill the available space, or use the Stretch layout option if your Wix template supports it.

Responsive Considerations

Wix handles responsive behavior differently than traditional HTML. A few things to keep in mind:

• The HTML embed widget does not automatically resize on mobile in the classic Wix editor — you may need to adjust the mobile version separately
• In the Wix mobile editor, click on the HTML widget and resize it for smaller screens
• Set the iframe width to 100% in your embed code so it fills whatever container Wix provides
• Consider reducing the height to 400–500px on mobile so the flipbook doesn't dominate the entire screen

If you're using Wix Studio (formerly Editor X), you have more control over responsive breakpoints and can set the widget to scale fluidly.

Step 5: Set Up Domain Whitelisting

If you've enabled domain restrictions on your flipbook for security, you'll need to whitelist your Wix domain so the embed loads correctly.

1. Go to your FlipLink dashboard
2. Open the flipbook's settings
3. Navigate to the Domain Whitelisting section
4. Add your Wix site's domain (e.g., www.yourbusiness.com or yourusername.wixsite.com)
5. Save your changes

Without whitelisting, visitors may see a blocked message instead of your flipbook. If you're using a custom domain connected to Wix, whitelist that domain rather than the default .wixsite.com address.

Troubleshooting Common Issues

The flipbook doesn't appear in the editor

• Make sure you selected HTML mode, not Website Address mode in the embed widget
• Verify that your flipbook is published (not in draft status) in FlipLink
• Check that the iframe src URL is correct and accessible in a regular browser tab

The flipbook loads but looks cut off

• Increase the height of the HTML embed widget in the Wix editor
• Ensure the iframe width attribute is set to 100%
• Check that no parent containers in your Wix layout are clipping the widget

The flipbook shows a blank white box

• Your flipbook may have domain whitelisting enabled — add your Wix domain to the allowed list
• Clear your browser cache and reload the page
• Try opening the flipbook URL directly in a new tab to confirm it loads

The embed looks different on mobile

• Switch to the mobile editor in Wix and adjust the widget size separately
• Reduce the iframe height for mobile to prevent excessive scrolling
• Test on an actual mobile device, as the Wix mobile preview can sometimes differ from real behavior

Alternative: Link Instead of Embed

If embedding isn't ideal for your layout — maybe you want a cleaner page or your flipbook is very long — you can link to it instead.

1. Copy the share link from FlipLink (not the embed code)
2. Add a button or text link on your Wix page
3. Set the link to open your flipbook URL in a new tab

This approach works well for:

• Email campaigns where you drive traffic to a dedicated flipbook page
• Navigation menus where you want a direct link to a catalog or magazine
• Landing pages where you prefer a clean hero section with a CTA button

You can also create a dedicated page on your Wix site that contains only the embedded flipbook, then link to that page from your navigation or other content.

Tips for a Better Flipbook Experience on Wix

• Place the flipbook below the fold if the page has other important content above it — large embeds can push key information down
• Add context above the embed with a short heading and description so visitors know what they're looking at
• Use a loading placeholder — add a brief text note like "Loading flipbook..." above the widget for slower connections
• Keep your flipbook optimized — compress your PDF before uploading to FlipLink for faster load times
• Test on multiple devices before publishing — check desktop, tablet, and phone to make sure everything looks right

Related Guides

If you're embedding flipbooks on other platforms, these guides walk through the process for each one:

• How to Embed a PDF on Any Website
• How to Embed a Flipbook in WordPress
• How to Embed a Flipbook with an Iframe

Start Embedding Your Flipbook Today

Getting a FlipLink flipbook onto your Wix site is straightforward: copy the embed code, drop it into an HTML widget, adjust the sizing, and publish. The whole process takes less than five minutes.

If you haven't created your flipbook yet, sign up for FlipLink and upload your first PDF. Check out our pricing page to see the lifetime deal — one payment, no subscriptions, and full access to all features including embed codes, custom domains, and analytics.