Wonder PDF Embed - Embed PDF to your WordPress

Wonder PDF Embed is a plugin to embed and display PDF files on your WordPress website by using Mozilla’s PDF.js.

Features

Please note: the options in the plugin only use CSS and JavaScript to hide the relative menu items/buttons in the PDF.js viewer toolbar. It’s NOT a DRM (Digital Rights Management) scheme to protect the PDF file. It does NOT stop experienced visitors from downloading, printing or copying text from the PDF file.

Table of Contents

PDF Embed Tutorial

You can use the following shortcode to embed a PDF file to WordPress posts or pages:

[wonderplugin_pdf src="https://www.yoursite.com/yourfolder/yourdoc.pdf" width="100%" height="600px" style="border:0;"]

The PDF URL must comply with the following requirements:

  • The PDF URL is defined with the src attribute.
  • The PDF file MUST be hosted on the SAME WEBSITE as your WordPress website.
  • The PDF URL MUST be an absolute URL.
    • If it starts with http:// or https://, it must have the same domain and same protocol as that of the webpage. Please note, https://www.yoursite.com and http://www.yoursite.com are different, https://yoursite.com and https://www.yoursite.com are also different.
    • Alternatively, you can remove the domain name from the URL, but it needs to be an absolute path and starts with /. For example, if the PDF URL is https://www.yoursite.com/yourfolder/yourdoc.pdf, you can use /yourfolder/yourdoc.pdf
  • Make sure there are no special characters in the PDF URL, for example, apostrophes, double quotes, accented letters etc.

Shortcode attributes:

  • You can use px or % for the width and height attributes, for example, 600px or 100%.
  • By using % for the width attribute, the PDF viewer will be responsive.
  • If you use 100% for the height attribute, make sure the container of the shortcode has a proper height value.
  • You can use the style attribute to define the CSS style of the PDF viewer which is an iframe.

PDF Embed Demo

* WonderPlugin Lightbox is not a free plugin and is not hosted on WordPress.org repository.

You can use the premium plugin WonderPlugin Lightbox to open a PDF file in a lightbox popup:

1. Install the plugin WonderPlugin PDF Embed.
2. Install the premium plugin WonderPlugin Lightbox.
3. In your WordPress post or page editor, switch to Text mode, add class="wplightbox" to the <a> tag. You can also use data-width and data-height to specify the maximum size of the lightbox popup. For example:

<a href="http://www.yourwordpresssite.com/yourdoc.pdf" class="wplightbox" data-width=1200 data-height=1200>Open PDF in Lightbox</a>

The PDF file URL must comply with the following requirements:

  • The PDF URL is defined with the src attribute.
  • The PDF file MUST be hosted on the SAME DOMAIN as your WordPress website.
  • The PDF URL MUST be an absolute URL, that's, the URL must start with http:// or https://.
  • Make sure there are no special characters in the PDF URL, for example, apostrophes, double quotes, accented letters etc.

PDF Lightbox Demo

Open PDF in Lightbox

* Wonder Carousel is not a free plugin and is not hosted on WordPress.org repository.

By using the premium plugin Wonder Carousel, you can create a WordPress carousel of PDF files.

1. Install the plugin Wonder PDF Embed.
2. Install the premium plugin Wonder Carousel.
3. In the plugin Wonder Carousel, step 1, click the button "Add PDF", then select a poster image and a PDF file for the carousel item. Please note, you will need to create image files for the PDF files by yourself and add them to the carousel as poster images.

PDF Carousel Demo