Increase website engagement with interactive content
Embedding a catalog or brochure directly on your website is a great way to keep users engaged and reduce bounce rates. Instead of forcing visitors to leave your site to download a PDF, an embedded flipbook lets them read your content inline with realistic page-turning animations.
Using the iframe embed code
The standard way to embed a flipbook is using an HTML <iframe> tag. FreeFlipbook automatically generates this code for you after conversion. It looks like this:
<iframe src="https://freeflipbook.com/books/your-book-id" width="100%" height="600px" frameborder="0" allowfullscreen></iframe>Platform integrations
- WordPress: Add a 'Custom HTML' block in the Gutenberg editor and paste the iframe code.
- Shopify: In your page or product description editor, click the 'Show HTML' button (looks like
<>) and paste the code. - Wix & Squarespace: Use the 'Embed Code' or 'Code' block element, select HTML, and paste the code.
Making your embed responsive
Set the width attribute to 100%. This ensures the flipbook player automatically shrinks or expands to fit desktop and mobile viewports seamlessly.