Thank you for purchasing my item. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form. Thanks so much! Please rate the file on your downloads page if you like it!
This part of the documentation is going to cover, in a step by step instruction the installation of WP Plugins on your WordPress blog in general.
Once you have Flipbook plugin activated you can start creating flipbooks.
Step 1. Go to plugin admin page by clicking "Real3D Flipbook" on the left hand side of the admin page. Page 'Flipbooks' will open. Here you can create, duplicate or delete flipbooks.
Step 2. To create a new flipbook click 'Add New' button. New page 'Edit flipbook' will open where you can create JPG flipbook or PDF flipbook
Flipbook can be created directly from PDF.
Step 1. Select tab 'Pages'
Step 2. Click "PDF Flipbook" . Media library will open.
Step 3. Select or upload pdf file. Pages from pdf will be automatically added to flipbook.
Step 4. Click 'Save'.
PDF from another domain
For using PDF from another domain you need to enable CORS by adding following header to server response
Access-Control-Allow-Origin: *
Fast PDF loading
PDF flipbook supports partial PDF download (it can display pages before entire PDF is downloaded). For that feature to work server needs to support range requests.
Flipbook can be created from JPG images.
Step 1. Select tab 'Pages'
Step 2. Click button 'JPG flipbook'. Media library will open.
Step 3. Select jpg pages from media library or upload jpg pages to media library. You can select or upload multiple pages at once, no need to upload one by one.
Step 4. Click 'Save'.
This option converts PDF to JPG images, saves JPG-s to server to folder wp-content/uploads/{book name} and creates JPG flipbook.
It is optimal way of creating flipbook from PDF if you don't need interactive PDF features like liknks, text search or text select.
Step 1. Select tab 'Pages'
Step 2. Click "PDF to JPG Flipbook" . Media library will open.
Step 3. Select or upload PDF file. Pages from PDF will be automatically added to flipbook.
Step 4. Click 'Save'.
Flipbook created this way will load pages faster then standard PDF flipbook because it does not load PDF.js scripts or process PDF at runtime but only download JPG images.
After pages are added to flipbook you can edit each page by clicking on page thumbnail.
Title - Page title will appear in table of content. It the page title is empty the page will not be llisted in table of content.
HTMLContent - In this section you can add any HTML content to a page, that will be rendered on a separate layer on top of the page image.
For example you can add a link
<a href="http://www.codecanyon.net" traget="_blank">link</a>
you can add any inline css to the element
<a style="position:absolute;left:100px;top:100px;color:#00F" href="http://www.codecanyon.net" traget="_blank">link</a>
<div onclick="window.open('http://www.codecanyon.net','_blank')"></div>
or embed iframe
<iframe width="640" height="390" src="https://www.youtube.com/embed/tS1NCigEB_I" frameborder="0" allowfullscreen></iframe>
After you edited page click 'Save'. Now you can preview flipbook by clicking 'Preview'.
Custom Table of content will override table of content created by page titles or pdf outline embedded in pdf. You can add elements and sub elements. Each element or subelement has properties "title" and "page".
How the flipbook will be embedded. Available modes are normal - embedded in a container div, lightbox - opens in fullscreen overlay on click, fullscreen - covers entire page
Available are webgl - realistic 3D page flip with lights and shadows, 3d - CSS 3D flip, swipe - horizontal swipe
The size of pdf pages in px. For mode webgl this needs to be power of 2, for other modes can be any value. Recommended 1024 - 4096
Override maximum zoom size which is by default equal to texture size. For example "texture size" is 2048, emable zoom beyond texture size with "zoomed texture size" : 3000
Initial book zoom, recommended between 0.8 and 1
Between 1.1 and 4
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
height of the container
if the container will fit the entire screen
if the container will fit the parent div
if the container will fit the parent div height
if the container height will be proportional to width
Container aspect ratio (for responsive height)
the ratio width / height for the responsive container, recommended between 1 and 2
Any element on the page containing flipbook shortcode that has this CSS class will trigger lightbox
Custom CSS that will be applied on the lightbox container (element that contains lightbox thumbnail or lightbox text)
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")
image that will be added in place of shortcode and will trigger the lightbox
custom CSS for thumbnail (size, shadows, border ect)
Text that will be put in place of the shortcode and will trigger the lightbox
custom CSSfor the text link (size, shadows, border ect)
If the lightbox opens immediately when the page loads
if the lightbox opening will also switch browser to fullscreen mode
Lightbox overlay vertical margin
Lightbox overlay horizontal margin
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
Override default flipbook settings for mobile devices (hide some buttons on mobile, use different resolution)
With UI settings you can change background and menu colors, layout and styles
Choose between 4 premade UI layouts
Choose between light, dark or gradient skins
Choose between Font-awesome or Material icon sets
Override default UI layout and customize colors, sizes, margins, backgrounds of all UI elements
Once you are finnished with adding pages and editing options, you need to
For quick testing
id - the id of the flipbook. The default shortcode that looks like this
[real3dflipbook id="1"]
name - the name of the flipbook. You can embed the flipbook also with name, like this
[real3dflipbook name="flipbook1"]
pdf - you can assign (override) the pdf url that will be displayed with flipbook
if you embed flipbook with shortcode
[real3dflipbook id="1" pdf="http://www.yourwebsite.com/1.pdf"]
it will show the pdf file that is specified in shortcode. This enables you to create only one "template" flipbook and use it for multiple flipbook on the page.
You can use that shortcode to show multiple PDF files using the same flipbook like this
[real3dflipbook id="1" pdf="http://www.yourwebsite.com/1.pdf"] [real3dflipbook id="1" pdf="http://www.yourwebsite.com/2.pdf"]
You can export all your books as JSON. This is useful for making a backup or moving your flipbooks to another server. To export flipbooks to JSON go to plugin anmin page 'Flipbooks' and click 'Export to JSON'. The JSON code will be generated and you can save it to a txt file.
Import from JSON will remove all your current books and import flipbooks from JSON that you enter (paste) in the input field. Before clicking 'Import from JSON' make sure that you have your current flipbooks saved to JSON.
You can easily move your flipbooks to another server.. You need to
1 move all assets (images, pdf-s) to new server
2 Export flipbooks to JSON
3 edit JSON- replace all paths to pages and pdf-s in json with new paths
4 on new server import from the edited JSON
Increase max_input_vars in your php.ini from default 1000 to higher value, for example 3000 and restart server. If you don’t find max_input_vars in your php.ini file then add it like this
max_input_vars=3000
save and restart server. Make sure that max_input_vars in not commented out with semicolon at the beginning of the line like this
;max_input_vars=3000
You uploaded the zip that is not valid WordPress plugin (wrong zip file). You need to upload real3dflipbook.zip.
Make sure your server supports range requests. That is required so PDF pages can be rendered before entire PDF is downloaded.
Optimize JPG-s for web use. Images should be 200-300kb in size and maximum 2000 - 3000 px in height.
Access-Control-Allow-Origin: http://foo.example
Social share buttons
You can add social share button by clicking button 'Add share button' and then assign icon css class, icon name, link and target. (any font-awesome icon can be used, to see the full list of icons go here)