The cover of a printed catalog is often an extension of your shopfront: designed to entice and draw shoppers in. Your digital catalog is no different: show it to the world! And why not start with putting it on your website?
Embedding the Flipbook on your website is a great way to drive traffic to it, and an easy way to share.
📖 This article explains:
Embedding your Flipbook as a Minipaper
Minipapers is a method for which to easily embed a miniaturized version of a Flipbook on your website.
💡 Being a dynamic preview of your Flipbook, any changes you make to your Flipbook will automatically be reflected in your Minipaper!
To do this, you have to add a small iFrame in your HTML. Luckily, we've made it easy! Here's how:
Get embed code
Select the Flipbook you wish to embed.
Navigate to the Embeds pane.
You'll now see a number of available fields that allow you to customize your embed code:
Page: This field informs the embed code generator which page to use when rendering an image for your embed code. By default, this will be the first page of your Flipbook. However, you can change it to any page within your Flipbook.
⚠️ Please note: Any pages that are part of a spread within your Flipbook will be generated as such. For example, if you select page 4, the generator will render an image showing pages 4-5 as a spread.
Width: In this field, you can define the width, in pixels, of your embed.
Height: The vertical counterpart to the width field, here you can set the height, in pixels, of your Flipbook embed.
⚠️ Please note: If you enter a single value in either the fields, i.e., only a value in the Width field, the Height field will be automatically set to the best fit in relation to the width.
If both fields are left blank, as they are by default, the embed will the available space defined for the embed, on your webpage.
View: Here you can pick how you want your Flipbook to be presented on your site. You have several options of how to present your Flipbook: Perspective, Single page, Spread, or Page slider.
You can also see a preview of your selection in the preview pane to the right.
Once you've found the perfect way to present your Flipbook, click Get embed code at the bottom.
We've written up the code needed to show the Embed the way you want it, so now it's simply pasting it into your website's HTML in the desired location.
Additional options for embedding Minipapers
When embedding your Flipbook on your website as a Minipaper, you have additional options available to you, such as:
You can find full technical documentation for embedding your Flipbook as a Minipaper, below:
Of course, if you're unsure of anything, or have questions about how best to embed your Flipbook on your website, reach out to our team using the messenger in the corner, and we'll be happy to help! ✌️