Flipbook Settings
Fully customize your flipbook with many available settings.
Last updated
Was this helpful?
Fully customize your flipbook with many available settings.
Last updated
Was this helpful?
With global settings you can change settings for all flipbooks. Global settings are found in Real3D Flipbook > Settings.
Each flipbook can override global settings with its own settings.
Custom Table of content will override Table of Contents created by page titles or PDF outline embedded in PDF. You can add elements and subelements. Each element or subelement has properties 'title' and 'page'.
Flipbook embed mode, following modes are available:
Flipbook embedded in a container div
Flipbook opens in a fullscreen overlay on thumbnail click
More about Lightbox settings here
Flipbook covers entire page
Following view modes are available:
realistic 3D page flip with lights and shadows
CSS 3D flip
CSS flip animation
horizontal slide animation
change page instantly without animation
Initial book zoom, recommended between 0.8 and 1
Between 1.1 and 4
Override maximum zoom size which is by default equal to texture size. For example "texture size" is 2048, enable zoom beyond texture size with "zoomed texture size" : 3000
Reset zoom after page flip, window resize, exit from fullscreen or toggle toc, thumbs, bookmarks, search
Zoom with double click
Display one page at a time
Duration of flip animation, recommended between 0.5 and 2
Enables to link to specific page within flipbook, for example if flipbook is at example.com, open page 2 with example.com#2
Instead of default deeplinking hash #$page_number it can be defined custom prefix so the hash will be #$prefix$page_number. For example link to flipbook page 2:
myflipboook.com#2
link with custom prefix "book1_page"
myflipboook.com#book1_page2
Switching from two page layout to one page layout if flipbook width is below certain threshold
Flipbook width threshold for responsive view feature, default 480
Height of rendered PDF page, in px
Height of rendered PDF page on small screen
height of the container
if the container height will be proportional to width
Enable for text selection tool and text search, disable for faster page loading
The color overlay of PDF links
The color overlay of PDF links on hover
If the flipbook has cover (1, 2-3, 4-5,...) or shows only inner pages (1-2, 3-4, 5-6,...)
If the flipbook has back cover
The ratio width/height of the flipbook container div (mode normal), recommended between 1 and 2
Show thumbnails view on start
Show Table of Content view on start
Show search menu on start
If pages will flip automatically
Automatic page flip interval
Flipping from right to left (inverted)
Thumbnail height for thumbnails view
Logo image that will be displayed inside the flipbook container
URL that will be opened on logo click
If the logo link will open in new tab
Custom CSS for logo
Example '#menu' or '.navbar'. Used with mode 'fullscreen' so the flipbook will be resized correctly below the menu
Set z-index of flipbook container
Text that will be displayed below the preloader spinner
Add your Google Analytics ID to track custom events from flipbook. Available events are 'lightbox open' and 'pdf download'
To find the Google Analytics ID:
Select an account from the menu in the ACCOUNT column.
Select a property from the menu in the PROPERTY column.
Always use keyboard arrows for flipping pages
Set to Disabled to disable right click save image
Option to limit flipbook access to only WooCommerce users who bought the product or have subscription, by default everyone has full access to flipbooks
Lightbox flipbook displays flipbook thumbnail on the page and opens the flipbook in a fullscreen overlay when the thumbnail is clicked. There are other options to open the lightbox flipbook, like using a CSS class or using hash navigation (deep linking). Thumbnail can be hidden if the flipbook should be opened from a button or text link.
Any element on the page containing flipbook shortcode that has this CSS class will trigger the lightbox.
Lightbox background CSS, for example hex color:
or rgb color:
or rgba color with transparency:
or image:
Background image repeated
Background image for the flipbook
Custom CSS for the thumbnail container div
Image that will be added in place of shortcode and will trigger the lightbox. Thumbnail is automatically generated from flipbook first page thumbnail or from first PDF page. To change the thumbnail size update the option Thumbnail height and click Generate Thumbnail
The height in px of the generated thumbnail image
Custom CSS for thumbnail (size, shadows, border, etc.)
If the thumbnail info will be displayed over the book
If not set, the book name will be used
Custom CSS for thumbnail info
Text that will be put in place of the shortcode and will trigger the lightbox
Custom CSS for the text link (size, shadows, border, etc.)
Top or bottom
If the lightbox opens immediately when the page loads
If the lightbox opening will also switch browser to fullscreen mode
Show book title
Show book date
Do not display the thumbnail
Lightbox overlay vertical margin
Lightbox overlay horizontal margin
Open URL instead of opening the flipbook
Open link in new browser window
Here you can adjust the WebGL view like lights, shadows, camera angle or page material.
Realistic lightning, disable for faster performance
Light X position, between -500 and 500
Light Y position, between -500 and 500
Light Z position, between 1000 and 2000
Light intensity, between 0 and 1
Realistic page shadows, disable for faster performance
Shadow quality, 1024 or 2048 or 4096
Shadow darkness, between 0 and 1
Distance of shadow from the page, between 10 and 20
Between 1 and 5, default 2
Between 1 and 5, default 2
Between 0 and 1, default 1
Between 0 and 1, default 0
Number of page segments horizontally, default 6
Number of page polygons vertically, default 1
Shadow in the middle of the book
CSS color, for example #CCC
CSS color, for example #999
Disable for faster performance
Between -10 and 10
Between -30 and 0
Max pan angle for mouse drag rotate, between 0 and 20
Min pan angle for mouse drag rotate, between -20 and 0
Max tilt angle for mouse drag rotate, between -60 and 0
Min tilt angle for mouse drag rotate, between -60 and 0
Max pan angle for mouse move rotate, between 0 and 5
Min pan angle for mouse move rotate, between -5 and 0
Max tilt angle for mouse move rotate, between -10 and 0
Min tilt angle for mouse move rotate, between -10 and 0
With UI settings you can change background and menu colors, layout and styles.
Here you can customize the UI by changing layout, colors, icon set.
Choose between 4 premade UI layouts.
Choose between light, dark or gradient skins.
Choose between Font-awesome or Material icon sets.
UI layout, colors, sizes, margins, backgrounds
Primary color - icon color, text color
Secondary color - UI background color
Color of flipbook container. Can be color, pattern, image or transparent.
Buttons on fixed menu
Buttons on transparent menu
Arrows for turning pages that are on the left and right side of the book
If not enabled, navigation arrows will show in the menu
Here you can customize the toolbar by enabling or disabling each button, changing button position (top or bottom toolbar), icon and title.
Here you can replace default strings with your translation.
Adjust flipbook settings for mobile
Flipbook can have different settings for mobile, which can be configured in
Edit Flipbook > Mobile
Flipbook size can be changed with setting Mobile > Container responsive ratio which is the width/height ratio of the flipbook container. For landscape container, this setting needs to be more than 1, for example 1.5 or 2. For portrait mode, this setting needs to be less than 1, for example 0.5 or 0.7.
Automatically open any PDF link as lightbox flipbook. Enabled by default.
If Convert PDF links is enabled, setting this option will convert only PDF links with this CSS class. Use this if you want to open only specific PDF links as flipbooks.
If Convert PDF links is enabled, setting this option will not convert PDF links that have this CSS class. Use this to force the default behavior for specific links.
Flipbook container height is proportional to width and maintains constant width/height ratio. This ratio can be changed with option
Sign in to .
Click .
Under PROPERTY, click Tracking Info > Tracking Code. Your is displayed at the top of the page.
