alogo

WordPress Popup PDFs

This tutorial is based on the fact that PDFs have become the leading document integrators on the Web.  Note the distinction – PDFs are multi-page containers for completed rich output like word documents, spreadsheet tables or Visio and other  Object diagrams.  PDFs are not like web development containers like Docker, Kubernetes, and Envoy which encompass completely active working apps.  But, over the years Adobe has built the print document capabilities of PDF such that it has displaced XML and even Office containers for storage, display and distribution of finished reports and documents.

  • Adobe has crammed PDF files with display and media handling features:
    • display features like easy zoom and positioning, text or thumbnail Tables of Content, easy transition to and from full screen viewing mode, paging capibilities and zooming;
    • media and CSS styling features like handling a wide range of bitmap photos and vector images/illustrations, multiple pages with header/footer and column layouts, etc
    • security features like password protection, privileged users, and legal signature/ endorsement capabilities;
  • PDFs have also become a leading document integration tool because so many apps including Micrsosft Offce, LibreOffice, Free Office , WPS  Office, Polaris OfficeOnlyOfficeZoho Workplace, plus a wide range of  form design, developer tools, and major graphic apps,  etc – all have Export to PDF commands .
  • Likewise, print commands in Apple MacOS, iOs, Linux, Android OS and Windows have PDF as the preferred file target for local or Cloud storage;
  • Readers should visit the free  PS2PDF.com website for its 145apps for converting to and from PDF and other media files.
    It is free, fast, and easy to use.
  • There are Information Integration gaps that WP’s RestAPI and WP/RPC have failed to fill leaving gaps in PDF integration
  • The two biggest are:
    1. Messaging services  are a sprawling landscape as seen here with free Kubernetes leading the parade with just emerging small WP support;
    2. Enterprise program integration is lead by Zapier and 5 free alternatives which provides standard API connection between systems similar to ODBC in the SQL database realm.

The bottom line for many WordPress websites is that having good PDF display routines is an essential part of their messaging.  This is what this review is about: WordPress PDF Display plugins. But if you follow the previous link, you will see there is a wide array of free and pro plugins available to WordPress developers. What this review will seek to do is highlight some unique display tools

Doing PDF Differently

The first PDF  plugin is PDF Embedder which is very easy to setup & operate:
In the PDFEmbedder settings, just set width and height to max or a pixelsize in numbers only. Users can also locate the PDF toolbar at the top or bottom of the display . Users can have the toolbar disappear on hovering the mouse over the toolbar – but users who see this flick on and off find it alarming.

The free version of PDFEmbedder  has  some Pro only features:

  • Continuous scrolling between pages
  • ‘Download PDF’ button allows users to obtain the PDF to read in their own choice of viewer
  • Full screen button
  • Fully functioning hyperlinks
  • Jump straight to the page by typing the page number
  • Tracking number of views and downloads
  • special mobile display options;
  • additional security settings for privileged users.

To setup the PDF viewer is dead simple. Place the cursor where you want the viewer to appear, open the Media Library and choose the PDF to be displayed and then click the Insert  into Post button. Immediately your post is ready to display your the PDF with basic control for its layout in width and height:
[pdf-embedder url=”http://theopensourcery.ca/wp-content/uploads/2020/09/wpthemebsimple.pdf”] PDFEmbedder is easy to use and the basic display is adequate  but can be much improved using the Pro version for $30US/year for use on up to 5 websites

3DFlip-Lite PDF  Viewer

3DFlip-Lite is a novel PDF viewer that flips through the  pages of a PDF file like they are pages of a magazine. The plugin even simulates flipping action – with the sound of pages rising and falling just like reading a magazine. Even better, users can load either PDFs or image files to create the flip viewer. Here are the examples of PDF display and then Fall Picture images:
Click here to see a live example

Next a PowerPoint presentation will be displayed in flipbook style:
Click here to see live example

3DFlip is not as easy to setup as PDFEmbedder but it has a wonderful set of display controls that allow PDF users many viewing options that put it at the top of free PDF Viewers.

See this video for an example of setup and use of 3DFlip-lite:
[iframe width=”900″ height=”510″ src=”https://www.youtube.com/embed/vPXKZpQb5n0?start=42″ frameborder=”0″ allow=”accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture”]

All the display magic is in the control bar:

ads
1)Page back  and forward icons;
2)Open and close table of content thumbnails;
3)Zoom out and zoom in icons;
4)Expand to full page display;
5)Share options;
6)Special Control commands.
These set of special plugin commands are the icing on the display cake. First, users can switch between single page display mode and two-page display. Next. one can quickly skip to the first page or the last page in the PDF. Finally, uses can turn on or off the page flip sound. Our tests found the ability to  expand to full page or zoom most useful
Now the setup for 3DFlip.is more complicated than PDFEmbedder because of 3DFlip’s many styling options. But to setup the 3Dflip for use of PDF or images is fairly simple as seen in the screenshots below:
It is simple to setup by just adding a PDF either from the Media Library or located by a live URL link. The next step is to decide the Outline options as seen below:
There are 3 options to enable thumbnail outlines or not display them [users can easily turn them back on with option 2 on the control bar as in the screenshot above]. Next, the Layout settings are a bit more complex and are illustrated in the video above.

3DFlip-Lite is a great value. The free version is loaded  with usable features and the pro version at $39US/years/website adds 15 setup and styling options.

Popup Builder – PDF Extension

Popup Builder is a freemium  Popup Building tool whose extensions make it more capable than Elementor Pro’s Popup  Builder widget. Both tools  have sophisticated event and condition controls  plus export/import of templates. But Elementor’s Popup widget provides more styling options but Popup Builder has more feature extensions.

We like both tools because they allow developers to more effectively do popups than other plugins that provide tooltips and some popup capabilities. So both Popup tools are more effective in managing precious UI Space on Landing Pages and above the foldline posts/pages/CPTs. These are areas where  traditional UI widgets like toggles, tool-tips, tabs, etc just eat up UI space while popups need only a button or banner triggered by click or hover action.

First, we shall demo the Popup Builder’s free HTML option be because this is such an improvement over many tooltip plugins. First, here is a screen shot of the Popup Builder’s HTML setup:
Yes, users have the full power of the WordPress Visual Editor to create their HTML popups. Note that I have used  a Foo Gallery short code with a simple intro paragraph.  And here is what it looks after a click:
Click here to see a live example of the HTML Popup. Note the popup is provided with vertical and horizontal scroll bars for any content that overflows the setup popup size. Also note the X close icon in the bottom left corner and the added green background to the popup. What I did not tell you is that styling setup  for this popup extends over two pages of non-trivial option settings. Yes, there is a learning curve to getting the look and styling of the popup working well.

Here is PDF Popup extension

Again Popup Builder PDF extensions costs $5/year/website and the install is exactly the same as for Popup Builder core code with one exception – users have to enter the PDF extension’s license code that is sent with the download links from the vendor.  Note the PDF extension setup looks like the 3DFlip PDF setup:
Now the big difference between 3DFlip  and Popup Builder PDF setup is that the latter has trigger or display rule settings. It also has at least 2 pages more of setup and styling instructions- see here for details. In the Setup, a Click on a link is used as a trigger – and produces the following popup when clicked:
Click here for a live example of the PDF Popup in action. In this case no vertical scroll bar is required because the PDF  pages can be triggered. But there is no outline or GotoTop or GotoEnd like in the 3DFlip control bar. But both tools provide a full screen viewing option.

Summary

Being able to display PDF files easily and attractively is vital to websites. PDFEmbedder is free and makes using PDF’s in WordPress easy. For a little extra cash the styling of the PDF display  can be improved. 3DFlip-Lite is also free and the master of displaying attractive PDFs suitable for use on fashion/eCommerce  stores, Realtor sites and  anywhere you want to add a display magazine to your website. Finally, Popup PDFs at $5/year/website are for the savvy developer that needs to  manage Landing Pages or top of foldline UI spaces very carefully. Triggered by click, hover or even scroll events, Popup PDFs go well beyond toggles, toolt-ips, tabs and accordions for managing your WordPress UI space. But be prepared for some complicated setup and styling  options.

Finally if you are still looking for the perfect  WordPress PDF viewer plugin, check out this 2020 list of freemium  PDF plugins.

Pin It on Pinterest