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!
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 Real 3D Flipbook plugin activated you can start creating your books.
To go to plugin admin page click Real 3D Flipbook icon on the left hand side of the admin page or click on Real3D Flipbook or Settings > Real 3D Flipbook
Page 'Manage flipbooks' will open. Here you can create, duplicate or delete flipbokos. You cal also see the shortcode for each flipbook that you will use to mebed the flipbook on the page.
To create a new flipbook click either 'Add New' or 'Create New Flipbook'. You will be taken to page 'Edit book' where you add pages and edit settings for the newly created flipbook.
To add pages you can either add jpg pages or add pages from PDF
To add pages from PDF file click button 'Add pages from PDF'. You can then select a PDF file from your wordpress media library or upload a new PDF and then select it.
After the PDF file was selected the pages will be generated and saved on your server in folder wp_content/plugins/real3dflipbook/books/flipbook_name. After all pages have been created you can proceed with editing flipbook options. You can also add more pages, delete pages or rearrange pages with click and drag.
To create flipbook from PDF url you need to select PDF file from your media library. This mehod will generate flipbook pages on the client side for each user so it is slower then the first method 'adding pages from PDF' that generates on the server side only once.
To add jpg pages to your flipbook click button 'Add jpg pages'. Media library open and you can upload your jpg pages or select already uploaded pages and click select.
Pages will be added to your flipboo and you can proceed with editing flipbook options. You can also add more pages, delete pages or rearrange pages with click and drag.
Each page has
Page title will appear in table of content. It the page title is empty the page will not be llisted in table of content.
Here you can edit page image url. If you have a problem with page that was generated from the PDF, you can replace the page image by clicking 'select file
Same as image, you can eidt thumbnail image for each page
Pages can be rearranged by click & drag. You can add more pages or delete any of the currently added pages.
HTMLContent
In this section you can add any HTML code. This 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 something like this
<div style="position:absolute;left:100px;top:100px;background:#CCC"> <a href="http://www.codecanyon.net" traget="_blank">link</a> </div>
or embed iframe
<iframe width="640" height="390" src="https://www.youtube.com/embed/tS1NCigEB_I" frameborder="0" allowfullscreen></iframe>
Simply, you can add any HTML content on the page.
If any page has HTMLContent then view mode will be automatically switched from default "webgl" to "3d"
Flipbook mode [String] You can select either 'normal', 'lightbox' or 'fullscreen'
Flipbook view mode [String] You can select either 'webgl', 3d or '2d'
Skin [String] You can select either 'light' or 'dark'
Page flip duration [Number] Duration of the flip animation
Shadow of flipping page (3d&2d) [Boolean] if the shadow of currently flipping page will be displayed
Shadow of non flipping page (3d&2d) [Boolean] if the shadow of next and previous pages will be displayed
Shadow of non flipping page (3d&2d) [Boolean] if the shadow of next and previous pages will be displayed
Light overlay of pages [2d&2d] [Boolean] another light and shadow overlay
Deep linking [Boolean] if deeplinking will be used. With deeplining any page can be opened directly from the url.
Deep linking prefix [text] 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
Single page mode [Boolean] if single page layout will be used instead of standard double page layout
Flipbook will be displayed in a div that is 100% width of the container
Flipbook background color [String] Flipbook background color, default: #818181
Background image pattern [String] url of background image tile
Flipbook height [Number] height of the flipbook container
Fit to window [Boolean] if the flipbook container will fit the entire screen
Fit to parent div [Boolean] if the flipbook container will fit the parent div
Fit to height [Boolean] if the flipbook div will fit the parent div height
Responsive height [boolean] if the flipbook height will be responsive relative to the width
Aspect ratio (for responsive height) [Number] the ratio width / height for the responsive flipbook container
Flipbook will be opened in a lightbox after the lightbox link is clicked. Lightbox link can be text, image, or you can assign a css class that will trigger the lightbox and add that css class to any element on the page. For this mode available options are:
Lightbox element CSS class [String] CSS class that will trigger opening flipbook in lightbox. It can be class of any element on the page like menu button, divm image, text ect.
lightboxContainerCSS [String] Custom CSS that will be applied on the lightbox container (element that contains lightbox thumbnail or lightbox text)
Lighbox thumbnail url [String] image that will be added in place of shortcode and will trigger the lightbox
Lightbox Thumbnail CSS [String] CSS code that will be applied to the thumbnail (size, shadows, border ect)
Lightbox text [String] Text that will be put in place of the shortcode and will trigger the lightbox
Lightbox text CSS [String] CSS code that will be applied to the text link (size, shadows, border ect)
Lightbox opens on start [Boolean] If the lightbox opens immediately when the page loads
Lightbox opens in fullscreen [Boolean] if the lightbox opening will also switch browser to fullscreen mode
Flipbook will cover the entire page. For this mode available options are
Flipbook background color [String] Flipbook background color, default: #818181
Background image pattern [String] url of background image tile
Flipbook offset top [Number] - use to adjust vertical position of the flipbook div directly below the page menu
Single page view [Boolean] if the single page view will be forced on mobile devices
Use default device pdf viewer [Boolean] if instead of flipbook app browser will open pdf directly in its own default pdf viewer. For this option PDF url must be set.
You can enable/disable any of the buttons in the toolbar and change icon by changing the icon css class (you can use any of the font-awesome icons, to see the full list of icons go here
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)
This will affect the resolution of generated jpg pages- larger value will generate larger jpg image, but larger images will load longer so try to find optimal ratio of quality and loading times
This will affect qualilty of generated jpg pages
Sometimes the page will be rendered as transparent, to fix this a background layer is added below the page and you can change color of that layer
Once you are finnished with adding pages and editing options, you need to
For quick testing
If you test on local server you might get browser security errors because of loading local files. For local testing please use Firefox or run Chrome with flag --allow-file-access-from-files. To do that :
On Windows, Click Start button, in the search bar type in 'run' and hit Enter
Tyoe in 'chrome --allow-file-access-from-files' and hit Enter
Now the Chrome is opened in mode that allows loading of local files.
If you have update the plugin from version older than 1.4.5 and you had pages generated form the pdf, you need to generate the pages again because pages were saved in the folder plugins/real3dflipbook/books that is deleted when the plugin is uninstalled. From version 1.4.5 pages are saved in wp-content/uploads.
Check folder premissons on your server. You can also use alternative method - 'flipbook from pdf url
Increase in php.ini max_input_vars
Check if you have errors in the browser console. Opening the console
Firefox Use the keyboard shortcut Control-Shift-K or select 'Web Console' from the Web Developer submenu in the Firefox Menu
Chrome Use the keyboard shortcut Control-Shift-J or select View > Developer > JavaScript Console
Check that you don't have javascript errors caused by other plugins
Check that you have plugin activated. If the plugin is activated plugin scripts will be loaded and you can see them in the 'scripts' tab in the dev tools.