# Flipbook Settings ## Global Settings With global settings you can change settings for all flipbooks. Global settings are found in **Real3D Flipbook** > **Settings**. ## Flipbook Settings Each flipbook can override global settings with its own settings. ## *Table of Contents* 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'.

Custom Table of Contents

## *General* ### Mode Flipbook embed mode, following modes are available: #### **normal** Flipbook embedded in a container div
Flipbook container height is proportional to width and maintains constant width/height ratio. This ratio can be changed with option [**Container responsive ratio**](#container-responsive-ratio) #### **lightbox** Flipbook opens in a fullscreen overlay on thumbnail click
More about Lightbox settings [**here**](https://real3dflipbook.gitbook.io/wp/broken-reference) #### **fullscreen** Flipbook covers entire page
### View mode Following view modes are available: #### **webgl** realistic 3D page flip with lights and shadows #### **3d** CSS 3D flip #### 2d CSS flip animation #### **swipe** horizontal slide animation #### simple change page instantly without animation ### Initial zoom Initial book zoom, recommended between 0.8 and 1 ### Zoom step Between 1.1 and 4 ### Zoomed size 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 Reset zoom after page flip, window resize, exit from fullscreen or toggle toc, thumbs, bookmarks, search ### Double click zoom Zoom with double click ### Single page Display one page at a time ### Page flip duration Duration of flip animation, recommended between 0.5 and 2 ### Deep linking Enables to link to specific page within flipbook, for example if flipbook is at example.com, open page 2 with example.com#2 ### Deep linking prefix 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 ### Responsive view Switching from two page layout to one page layout if flipbook width is below certain threshold ### Responsive view threshold Flipbook width threshold for responsive view feature, default 480 ### PDF page size Height of rendered PDF page, in px ### PDF page size (small) Height of rendered PDF page on small screen height of the container if the container height will be proportional to width ### PDF Text layer Enable for text selection tool and text search, disable for faster page loading ### PDF Link color The color overlay of PDF links ### PDF Link color hover The color overlay of PDF links on hover ### Front cover If the flipbook has cover (1, 2-3, 4-5,...) or shows only inner pages (1-2, 3-4, 5-6,...) ### Back cover If the flipbook has back cover ### **Container responsive ratio** The ratio width/height of the flipbook container div (mode normal), recommended between 1 and 2 ### Show Thumbnails on start Show thumbnails view on start ### Show Table of Contents on start Show Table of Content view on start ### Search PDF on start Show search menu on start ### Close Table of Contents when page is clicked ### Close Thumbnails when page is clicked ### Autoplay on start If pages will flip automatically ### Autoplay interval (ms) Automatic page flip interval ### **Right to left mode** Flipping from right to left (inverted) ### **Thumbnail size** Thumbnail height for thumbnails view ### **Logo image** Logo image that will be displayed inside the flipbook container ### **Logo link** URL that will be opened on logo click ### Logo link target If the logo link will open in new tab ### **Logo CSS** Custom CSS for logo ### Menu CSS selector Example '#menu' or '.navbar'. Used with mode 'fullscreen' so the flipbook will be resized correctly below the menu ### Container z-index Set z-index of flipbook container ### **Preloader text** Text that will be displayed below the preloader spinner ### **Google Analytics tracking code** 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: 1. Sign in to [your Analytics account](https://analytics.google.com/). 2. Click [Admin](https://support.google.com/analytics/answer/6132368). 3. Select an account from the menu in the ACCOUNT column. 4. Select a property from the menu in the PROPERTY column. 5. Under PROPERTY, click **Tracking Info** > **Tracking Code**. Your [Google Analytics ID](https://support.google.com/analytics/answer/7372977) is displayed at the top of the page. ### Download PDF instead of displaying flipbook if browser is IE ### Force keyboard arrows for navigation Always use keyboard arrows for flipping pages ### Disable arrows for navigation if not fullscreen ### Touch swipe to turn page ### Right click context menu Set to Disabled to disable right click save image ### Access 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* 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. ### **CSS class** Any element on the page containing flipbook shortcode that has this CSS class will trigger the lightbox. ### **Overlay background** Lightbox background CSS, for example hex color: ``` #999 ``` or rgb color: ``` rgb(128,128,128) ``` or rgba color with transparency: ``` rgba(0,0,0,0.5) ``` or image: ``` url("images/background.jpg") ``` ### Overlay background pattern Background image repeated ### Overlay background image Background image for the flipbook ### Thumbnail container CSS Custom CSS for the thumbnail container div ### **Thumbnail** 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 ### Thumbnail height The height in px of the generated thumbnail image ### **Thumbnail CSS** Custom CSS for thumbnail (size, shadows, border, etc.) ### Thumbnail info If the thumbnail info will be displayed over the book ### Thumbnail info text If not set, the book name will be used ### Thumbnail info CSS Custom CSS for thumbnail info ### **Text link** Text that will be put in place of the shortcode and will trigger the lightbox ### **Text link CSS** Custom CSS for the text link (size, shadows, border, etc.) ### Text link position Top or bottom ### **Opens on start** If the lightbox opens immediately when the page loads ### **Opens in fullscreen** If the lightbox opening will also switch browser to fullscreen mode ### Show title Show book title ### Show date Show book date ### Hide thumbnail Do not display the thumbnail ### **Vertical margin** Lightbox overlay vertical margin ### **Horizontal margin** Lightbox overlay horizontal margin ### Link Open URL instead of opening the flipbook ### Link opens in new window Open link in new browser window ## *WebGL* Here you can adjust the WebGL view like lights, shadows, camera angle or page material. ### Lights Realistic lightning, disable for faster performance ### Light position x Light X position, between -500 and 500 ### Light position y Light Y position, between -500 and 500 ### Light position z Light Z position, between 1000 and 2000 ### Light intensity Light intensity, between 0 and 1 ### Shadows Realistic page shadows, disable for faster performance ### Shadow Map Size Shadow quality, 1024 or 2048 or 4096 ### Shadow opacity Shadow darkness, between 0 and 1 ### Shadow plane distance Distance of shadow from the page, between 10 and 20 ### Page hardness Between 1 and 5, default 2 ### Cover hardness Between 1 and 5, default 2 ### Page material roughness Between 0 and 1, default 1 ### Page material metalness Between 0 and 1, default 0 ### Page segments W Number of page segments horizontally, default 6 ### Page segments H Number of page polygons vertically, default 1 ### Page middle shadow size Shadow in the middle of the book ### Left middle shadow color CSS color, for example #CCC ### Right middle shadow color CSS color, for example #999 ### Antialiasing Disable for faster performance ### Camera pan angle Between -10 and 10 ### Camera tilt angle Between -30 and 0 ### Rotate camera on mouse click & drag ### Camera pan max Max pan angle for mouse drag rotate, between 0 and 20 ### Camera pan min Min pan angle for mouse drag rotate, between -20 and 0 ### Camera tilt max Max tilt angle for mouse drag rotate, between -60 and 0 ### Camera tilt min Min tilt angle for mouse drag rotate, between -60 and 0 ### Rotate camera on mouse move ### Camera pan max Max pan angle for mouse move rotate, between 0 and 5 ### Camera pan min Min pan angle for mouse move rotate, between -5 and 0 ### Camera tilt max Max tilt angle for mouse move rotate, between -10 and 0 ### Camera tilt min Min tilt angle for mouse move rotate, between -10 and 0 With UI settings you can change background and menu colors, layout and styles. ## *UI* Here you can customize the UI by changing layout, colors, icon set. ### **Layout** Choose between 4 premade UI layouts. ### **Skin** Choose between light, dark or gradient skins. ### **Icons** Choose between Font-awesome or Material icon sets. ## Advanced UI settings UI layout, colors, sizes, margins, backgrounds ## Skin ### Color Primary color - icon color, text color ### Background color Secondary color - UI background color ## Flipbook background Color of flipbook container. Can be color, pattern, image or transparent. ## Top menu ### Background color ### Shadow ### Margin ### Padding ### Over book ### Transparent ### Floating ## Bottom menu ### Background color ### Shadow ### Margin ### Padding ### Over book ### Transparent ### Floating ## Buttons Buttons on fixed menu ### Color ### Background color ### Radius ### Margin ### Size ### Padding vertical ### Padding horizontal ### Box shadow ### Text shadow ### Border ## Floating Buttons Buttons on transparent menu ### Color ### Background color ### Hover holor ### Hover background color ### Size ### Radius ### Border ## Side navigation buttons Arrows for turning pages that are on the left and right side of the book ### Enabled If not enabled, navigation arrows will show in the menu ### Color ### Background color ### Radius ### Margin ### Size ### Padding vertical ### Padding horizontal ### Box shadow ### Text shadow ### Border ## *Menu buttons* Here you can customize the toolbar by enabling or disabling each button, changing button position (top or bottom toolbar), icon and title. ## *Translate* Here you can replace default strings with your translation. ## *Mobile* Adjust flipbook settings for mobile Flipbook can have different settings for mobile, which can be configured in `Edit Flipbook > Mobile` #### Flipbook size 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. ## *Overrides* ### Convert PDF links Automatically open any PDF link as lightbox flipbook. Enabled by default. ### Convert only PDF links with CSS class 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. ### Convert only PDF links without CSS class 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.