Bookshelf design and functionality

Learn how to add your flipbooks into single customized collections called bookshelves

Table of contents:

Creating your bookshelf

Access more bookshelf settings

1. Details

2. Customize

3. Embed

4. Statistics

5. Send email

6. Download QR code

Delete bookshelf

Watch this video for a quick, step-by-step guide on how to add, organize, and personalize your bookshelves, including tips on selecting colors and embedding them on your website.

 

In this article, we're going to see how to add a shelf widget for those who want to display multiple flipbooks in the same collection, like a newsstand.

Creating your bookshelf

1. To create a shelf, simply go to the main dashboard and select Create bookshelf at the top of the page.create-bookshelf-button-in-flipsnack

2. This will open a new page in which all your currently published flipbooks will be displayed. You can then select all the flipbooks that you want to appear on your bookshelf by clicking on them. 

Note: You can only add published and unlisted flipbooks to a bookshelf.

If you ever decide that you no longer want a flipbook from the bookshelf to be available to everyone, there are a few options you can consider:

a. change the visibility setting for the flipbook

b. remove the flipbook from the bookshelf

select-the-flipbooks-for-your-bookshelf

3. After you've selected your flipbooks, click on the Next step, which will take you to the Organize page. There, you can reorder them as you wish. When you're done, click the Share now button and move on to the last step.

organize-the-flipbooks-in-your-bookshelf-1

4. In the following pop-up, you'll have the option to fill in the bookshelf's title and description, plus its visibility: public or unlisted. When everything looks ready, simply click on Publish now, and your bookshelf will be created.

Important: If you share your bookshelf publicly, it cannot be made unlisted.

publish-bookshelf-modal-with-title-and-description-imputs-and-visibility-option

Here's what a default bookshelf looks like.

default-bookshelf-appearance

Looks super clean, right? Here's an example shelf if you wanna see it in action. 

Access more bookshelf settings

Once created, the Details page of your bookshelf pops up. This area is where you can personalize, share and track your bookshelf with many available options to access: customize, embed, statistics, send email, download QR code. Let’s take them one by one and see what settings you have:

1. Details

You can always access the Bookshelf Details page in the main dashboard by hovering your mouse over the shelf card. 

details-button-highlighted-in-the-bookshelf-card

Share your bookshelf directly on different social media platforms or via email. You can also copy the link to the bookshelf and share it directly with your audience. Think of these Details settings as the main navigation window for a particular bookshelf you created.

bookshelf-details-page

2. Customize

This area represents the bookshelf customization settings. Here, you can rename your bookshelf, change colors, set thumbnail sizes, and more. Here is what each of them does.

bookshelfs-customize-page

  • Bookshelf name: here’s where you can change the bookshelf name.
  • Logo: if you have a Business plan or up, here you’ll be able to add your logo to the bookshelf to increase brand identity. Click on Upload logo, select the desired image, and click the Add logo button. You can also add a link to your logo by typing the URL in the Add a link to your logo field. If you want to change the logo, you can do this anytime by clicking on Replace logo or, if you want to delete it, click on the trash icon.
  • Background: if you want a background for your bookshelf, you can choose between transparent, solid color, or an image for your bookshelf background. If you select a solid color you can either choose a team color that’s already been uploaded, a default color from the pallet, or HEX codes. If you want a background image, you can upload one from your computer and then choose between scale-crop, center, or tile positioning. A transparent background comes in handy if you want to embed the bookshelf on a website.
  • Bookshelf color: you can also choose a color from a pallet or based on a HEX code for the bookshelf itself. If you have two team or brand colors you like to use, you can choose one for the background and the other for the bookshelf.
  • Set thumbnail size: the thumbnail size can be adjusted between 75px and 300px in width.
  • Open flipbook in a new tab: check this option if you want your flipbooks to open in new tabs.
  • Allow searching in bookshelf: toggle the Allow searching in your bookshelf option, and your readers will quickly find their desired publication.
  • Show flipbook name on mouse hover: toggle the Show flipbook name on hover options, and your readers will be able to browse your bookshelf easily with their mouse to see the publication's name.
  • View live: this option, also beneath the preview, gives you the full-screen preview of your bookshelf.
  • Edit: this option is also under the preview, and here you can go back to editing the bookshelf.
  • Edit link name: this option is under the preview and allows you to edit the last part of the bookshelf's URL. 

bookshelf-customize-pageOnce you're happy with the changes you’ve made, simply click on the Save changes button, above the bookshelf preview. 

Note: If you are having trouble customizing old bookshelves, you will need to publish them again by going to Edit (not Customize) and clicking on Share now and then on the Publish now button. Then go back to the main dashboard, click on the Customize button, and now you should be able to change each setting.

3. Embed

To embed your bookshelf on your website, click on the Embed option in the same Details page, left-side panel. Here is where you can customize the embed size, copy the embed code, and enable the domain restriction option. This will prevent people from embedding your flipbook on any other website than the ones specified, which need to be added separately through the Add new link option. 

bookshelf-embed-page

4. Statistics

In this next option, you can check individual bookshelf statistics, starting with a summary of impressions, views, and average time spent. For more granular data, check insights from the flipbooks within, devices and sources, or global views by top location.

bookshelfs-statistics-page

Note: This feature is available with the Professional plan or higher.

Duplicating your bookshelf

If you want to share a bookshelf with more people and check individual statistics for each reader, you can easily make a copy of that bookshelf. Go to Flipbook options, click on Make a copy and share that specific bookshelf with the right recipient. You can customize the same bookshelf details and make it easier to differentiate between the different copies. 

Here's how amazing the bookshelf can look if integrated into a nicely designed website using the transparent background option. 

How the transparent background option looks like on a website

5. Send email

Distribute your bookshelf via a fully branded email. Customize your email, add company logo, title, description, label (desired CTA text), and background plus accent color.
send-bookshelf-via-email

Alternatively, you can send it using your email client and use code to embed the bookshelf snippet into your email newsletter, perhaps, like we mentioned in the Embed section of the Details page.

6. Download QR code

Generate a personalized QR code for your bookshelf, download it in different formats and share it with your readers. This QR code can also be branded with your logo.

download-a-qr-code-for-your-bookshelf

Deleting your bookshelf

Deleting your bookshelf will not impact the publications within it or remove them from your account. Each individual publication will remain unchanged.

You can also always leave your own suggestions using the live chat, and our friendly agents will pass them along to the product team.