PDF Embedder Documentation

Documentation, Reference Materials, and Tutorials for PDF Embedder

PDF Embedder Shortcode and Block Attributes

All the shortcode and block attributes mentioned in this article assume that you are using any paid version of the PDF Embedder plugin.

Shortcodes

Inserting a PDF is as easy as uploading an image into a WordPress page. In your page/post editing screen, click ‘Add Media’. Drag and drop your PDF anywhere into the media library and then click ‘Insert into post’.

You should see a ‘shortcode’ like this:

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf"]Code language: JSON / JSON with Comments (json)

There are many site-wide global settings that you can change in the Settings -> PDF Embedder page in WordPress, but you can also override many of these (and other settings unavailable through the main settings page) by adding extra attributes to the shortcode.

Size and Shape

You can optionally override width and height as follows:

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" width="500"]Code language: JSON / JSON with Comments (json)

Note the default value for width or height is ‘max’. To understand how the size and shape of the embedded PDF is calculated, please see the instructions for setting width/height in the global settings page.

Customize the Toolbar

Toolbar Location

Add toolbar="[top|bottom|both|none]" to the shortcode to change the location of the Next/Prev toolbar (default is ‘bottom’).

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" toolbar="top"]Code language: JSON / JSON with Comments (json)

Toolbar Fixed/Hover

Add toolbarfixed="on" (default is off) to keep the toolbar open at all times rather than only when the user hovers over the document.
Note this extends the length of your embedded area.

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" toolbarfixed="on"]Code language: JSON / JSON with Comments (json)

PDF Title

The PDF embed initially appears on the web page as a link to the PDF file, with the link text provided in the ‘title’ shortcode parameter (or the base filename if no title is specified). This should be visible to search engine crawlers, and also to viewers in the case of Javascript failure or delay. The link will be replaced by the interactive PDF display as soon as the plugin’s Javascript is able to run after the page loads.

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" title="Plan Summary"]Code language: JSON / JSON with Comments (json)

Scrollbars

Add scrollbar="[vertical|horizontal|both|none]" to the shortcode to change whether scrollbars are permanently displayed (default is none).

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" scrollbar="vertical"]Code language: JSON / JSON with Comments (json)

Continuous Page Scrolling

Add continousscroll="[on|off]" to the shortcode to enable or disable the continuous page scrolling functionality.

When disabled, viewers will be able to navigate the pages only using the toolbar “Prev” (arrow up) and “Next” (arrow down) buttons.

Download PDF

Download Button

Add download="[on|off]" to the shortcode to add a download button to the toolbar (default is on for the regular premium version, off for the secure version).

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" download="on"]Code language: JSON / JSON with Comments (json)

Mobile-friendly

By default, if the embed area is narrower than 500 pixels, the document will appear as a thumbnail with a large ‘View in Full Screen’ button. This is designed especially for mobile devices where it can be difficult to interact with a small area, but the same 500-pixel logic applies to any web browser.

You can change the cut-off width (or eliminate it entirely) by adding a mobilewidth parameter: e.g. mobilewidth="200", or "0" to always display the interactive document at any screen size. A ‘Full Screen’ button is always available on the toolbar, regardless.

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" mobilewidth="200"]Code language: JSON / JSON with Comments (json)

Page Number

You can optionally start on any page number in the PDF. For example, to open up on page 5:

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" page="5"]Code language: JSON / JSON with Comments (json)

Page Text Box

You can ensure the ‘page number’ text box is always visible for the user to enter a page number to jump to by using pagetextbox="on". If omitted or "off", the user needs to click on the page number display in order for it to change into a text box.

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" pagetextbox="on"]Code language: JSON / JSON with Comments (json)

Zoom starting percentage

Optionally specify the percentage zoom to start off the display. For example for 50% zoom:

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" zoom="50"]Code language: JSON / JSON with Comments (json)

The full-screen display, when first opened, will also use the zoom percentage you specify in the zoom parameter unless you also specify another parameter called fpzoom to override it.

For example, for the normal display to be at 50% zoom, but the full-screen version to be at 75%:

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" zoom="50" fpzoom="75"]Code language: JSON / JSON with Comments (json)

You can also use other non-percentage values, for example:

  • zoom="auto"
  • zoom="page-actual"
  • zoom="page-fit"
  • zoom="page-width"

External Links

Links to external websites will open up in a new window if the relevant option is checked in Settings. You can override this behavior for an individual embed by adding the newwindow="on|off" parameter to the shortcode:

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" newwindow="off"]Code language: JSON / JSON with Comments (json)

Scroll to top

Scroll to the top of the page when the user clicks next/prev if this option is checked in Settings. You can override this behavior for an individual embed by adding the scrolltotop="on|off" parameter to the shortcode:

[pdf-embedder url="https://example.com/wp-content/uploads/2015/01/Plan-Summary.pdf" scrolltotop="on"]Code language: JSON / JSON with Comments (json)

Site-wide settings

You can find out more about the settings page available through Settings -> PDF Embedder in your WordPress site here.

Still have questions? We’re here to help!

Last Modified: