How do I distribute a bookshelf?

Product: FlippingBook Publisher

When you use FlippingBook Publisher and upload your publications to FlippingBook Cloud, you can create collections of flipbooks. The two most important reasons are:

  • To automatically generate bookshelves, so you can share a whole collection of similar flipbooks with your audience;
  • To organize your publications for yourself, so you can easily find them later.

If you haven’t done so already, then have a look at our article that describes how to create and manage collections/bookshelves. The article you're reading now describes how you can distribute your bookshelves. There are basically two ways:

  1. Share the direct link to the bookshelf
  2. Embed the bookshelf into your own webpage

Share the direct link

Every bookshelf has its own link, which you can open directly in a browser. In that case, your bookshelf will look like this:

The bookshelf behaves as follows:

  • Every shelf contains up to 5 books. If you have more than 5 books, a second shelf is created.
  • The bookshelf responds to screen size. When the screen is not wide enough to contain the full bookshelf, the edges of the bookcase are removed. If it still doesn’t fit, then extra shelves are added to your bookcase and your books are moved to the next shelf.
  • By default, we use a white background. But if you want to, you can replace this with your own background as in the example above.
  • If you use a custom background image, which doesn’t fit the reader’s screen size then we resize it to maximize the available width/height (whichever is reached last). Any excess parts of the image that don’t fit will be cut off in equal parts. 
  • We recommend an image with an aspect ratio of around 16:9. The screen sizes of your readers will inevitably vary, but this seems to fit pretty well on most screens.
  • Note that the text of the headers is grey and may become poorly visible on some backgrounds.

To get the link to your bookshelf:

  • Open FlippingBook Cloud
  • Find your collection in My collections.
  • Right-click the collection and select Open from the drop-down menu.
  • This will open your bookshelf in your default browser. You can now simply copy the link from the address bar and send it to your audience, include it in emails, link to it from your webpages, or post it on social media.

Embed the bookshelf into your webpage

It is also possible to embed your bookcase seamlessly into your own webpage. All you need to do is add a bit of code in the CMS where you manage your webpage.

To get this code:

  • Open FlippingBook Cloud
  • Find your collection in My collections.
  • Right-click the collection and select Share.
  • Go to the Insert to Site tab.
  • Specify the desired width and height under the embed code field. If your webpage already contains a container then select Use Parent Container Size. Your bookcase will adjust itself to your container.
  • Click on the Copy Code button.
  • Go to the CMS where you manage your webpage and insert the copied code in the right place.

Note that until July 2020 the bookcase looked slightly different. If you prefer to use that look (for consistency) then that is still possible. You’d need to manually change the parameter in the iframe code from “embedded=true" to “embed=true”.

How many books will be fitted on one shelf depends on the width that you specify. Our default setting of 875 pixels fits 5 books. The minimum width that we recommend is 746 pixels. That fits 4 books and still keeps the full bookcase intact. Using less than 746 pixels causes the edged of the bookcase to disappear.

The height depends on the number of shelves that you want to make room for. The height for the header plus the first shelf is 390 pixels. For every additional shelf takes up 256 extra pixels. Thus:

1 shelf 390
2 shelves 646
3 shelves 902
4 shelves 1158
every additional shelf +256 pixels

Some content management systems may add a few pixels as a border when you embed content. In this case, you may need to add a few pixels to the width and height to accommodate.

If you add new publications to the collection, they will automatically appear on the webpage(s) where your bookshelf has been embedded. Please take this into account when specifying the height!

Was this article helpful?
drift chat