ThemeNcode Docs

Method 2: Using Shortcodes

Estimated reading: 7 minutes

Additionally. you can still use the previous method of inserting shortcodes. here are shortcodes you can use.

TNC FlipBook – PDF viewer for WordPress 10.9.0 comes with 2 extra shortcodes to make it compatible with Oxygen Builder or any other builders that get rid of page templates. In this article, you’ll get the list of those 2 shortcodes with the parameters. You just need to copy the shortcodes, replace the file URL and paste them on any of your pages or posts to have the viewer display there.

1. Link X Shortcode

[tnc-x-pdf-viewer-link file="#" target="_parent" download="true" print="true" fullscreen="true" share="true" zoom="true" open="true" pagenav="true" logo="true" find="true" current_view="true" rotate="true" handtool="true" doc_prop="true" toggle_menu="true" toggle_left="true" scroll="true" spread="true" language="en-US" class="test-pdf" text="Open PDF" page="" default_zoom="auto" pagemode="none"]

Parameters

  1. file: This is where you’ll provide the URL to the pdf file that will be opened with FlipBook. Make sure you use the direct URL to the pdf file ending in .pdf, otherwise it will not work. Also, make sure the pdf files are hosted under the same domain.
  2. class: You can use a custom CSS class for the generated link. Basically, this class is used for styling. for example, if you want the link to be a button and you’re using the bootstrap CSS framework, you can use the following in this field: btn btn-default
  3. text: This is the text that will appear as a link. Please make sure to fill this field, as it will display nothing on the front end if you keep this field empty.
  4. target: Link Target, Select how you want the link to open, in the same tab or in a new tab.
  5. download: Select if you want to show the Download button in the toolbar.
  6. print: Select if you want to show the Print button in the toolbar.
  7. fullscreen: Select if you want to show the Fullscreen button in the toolbar.
  8. Share: Select if you want to show the Share button in the toolbar.
  9. zoom: Select if you want to show the Zoom option in the toolbar.
  10. open: Select if you want to show the Open button in the toolbar.
  11. logo: Select if you want to show the Logo button in the toolbar.
  12. pagenav : Select if you want to show the Pagenav button in the toolbar.
  13. find: Select if you want to show the Find button in the toolbar.
  14. page: Enter the page number if you want to send the user to a specific page on opening of the file.
  15. default_zoom: Select the Default Zoom here
  16. pagemode : If you select Thumbs as pagemode, the left bar will be opened with page thumbnails and if you choose bookmarks, the left bar will be opened with the list of bookmarks. It is not recommended to use as it may not work smoothly on smaller screen sizes. We’ve added it just because it might be helpful for some users.
  17. language: Select the language you want to use
  18. current_view:  Select if you want to show the Current View button in the toolbar.
  19. rotate:  Select if you want to show Rotate View button in the toolbar.
  20. handtool:  Select if you want to show the Hand Tool button in the toolbar.
  21. doc_prop:  Select if you want to show the Document Properties button in the toolbar.
  22. toggle_menu:  Select if you want to show the Toggle Menu button in the toolbar.
  23. toggle_left:  Select if you want to show the Toggle Left button in the toolbar.
  24. scroll:  Select if you want to show Scroll options in the toolbar.
  25. spread:  Select if you want to show Spread options in the toolbar.
  26. default_scroll: Default Scroll Method, Use 1 for Vertical scrolling, Use 2 for Horizontal Scrolling, and use 3 for Flip Book
  27. default_spread: Default Spread Mode, options: 1 for No Spread, 2 for Odd Spreads, 3 for Even Spreads

Output:

You can see there is a link with the text “Open PDF”. When someone clicks the link a PDF file will open. The text can be changed to anything from the shortcode.

2. Embed X Shortcode

[tnc-x-pdf-viewer-embed file="#" width="100%" height="600" download="true" print="true" fullscreen="true" share="true" zoom="true" open="true" pagenav="true" logo="true" find="true" current_view="true" rotate="true" handtool="true" doc_prop="true" toggle_menu="true" toggle_left="true" scroll="true" spread="true" language="en-US" page="" default_zoom="auto" pagemode="none" iframe_title="Test iFrame"]

Parameters

  1. file: This is where you’ll provide the URL to the pdf file that will be opened with FlipBook. Make sure you use the direct URL to the pdf file ending in .pdf, otherwise, it will not work. Also, make sure the pdf files are hosted under the same domain.
  2. width: Specify the Width of iFrame in pixels here. For example, you can use 600
  3. height: Specify the height of iFrame in Pixels here. For Example, you can use 800
  4. download: Select if you want to show the Download button in the toolbar.
  5. print: Select if you want to show the Print button in the toolbar.
  6. fullscreen: Select if you want to show the Fullscreen button in the toolbar.
  7. Share: Select if you want to show the Share button in the toolbar.
  8. zoom: Select if you want to show the Zoom option in the toolbar.
  9. open: Select if you want to show the Open button in the toolbar.
  10. logo: Select if you want to show the Logo button in the toolbar. The logo will not be displayed if the iFrame width is small. But will display when users go to fullscreen mode.
  11. pagenav: Select if you want to show the Pagenav button in the toolbar.
  12. find: Select if you want to show the Find button in the toolbar.
  13. page: Enter the page number if you want to send the user to a specific page on opening of the file.
  14. default_zoom: Select the Default Zoom here
  15. pagemode: If you select Thumbs as pagemode, the left bar will be opened with page thumbnails and if you choose bookmarks, the left bar will be opened with the list of bookmarks. It is not recommended to use as it may not work smoothly on smaller screen sizes. We’ve added it just because it might be helpful for some users.
  16. language: Select the language you want to use
  17. current_view:  Select if you want to show the Current View button in the toolbar.
  18. rotate:  Select if you want to show Rotate View button in the toolbar.
  19. handtool:  Select if you want to show the Hand Tool button in the toolbar.
  20. doc_prop:  Select if you want to show the Document Properties button in the toolbar.
  21. toggle_menu:  Select if you want to show the Toggle Menu button in the toolbar.
  22. toggle_left:  Select if you want to show the Toggle Left button in the toolbar.
  23. scroll:  Select if you want to show Scroll options in the toolbar.
  24. spread:  Select if you want to show Spread options in the toolbar.
  25. iframe_title: Title of the iFrame tag
  26. default_scroll: Default Scroll Method, Use 1 for Vertical scrolling, Use 2 for Horizontal Scrolling and use 3 for Flip Book
  27. default_spread: Default Spread Mode, options: 1 for No Spread, 2 for Odd Spreads, 3 for Even Spreads

Output:

By using this shortcode, one can directly embed and show a PDF file with a FlipBook on a page or post. Change the shortcode as you need and the viewer will be changed according to it also.

Leave a Comment