How to Embed PDF Files in WordPress – Financeuse

There might be occasions whenever you would like to embed a PDF file in your publish or web page:

  • A guide creator might want give readers a free copy.
  • To add product catalogs in your web site.
  • To share your designs in PDF format with shoppers.
  • You could also be working a journey company and wish to show the itinerary of the tour packages.

But there’s a drawback!

Though WordPress lets you embed audios, movies and naturally, pictures, it’s not potential to embed PDF recordsdata in your posts and pages. This characteristic isn’t accessible to this point, perhaps it will likely be added in future.

In case you wish to add a PDF file, you may add the file utilizing the Add Media possibility, insert it, and the hyperlink to that file shall be added to your web page. And your guests can both obtain it or view the file within the net browser by leaving your web site.

But what if you wish to embed PDF recordsdata in your posts and let your guests view it with out leaving your web site? Is there any answer for that? The quick reply is YES.

So on this publish, I’ll present how one can embed a PDF file in your WordPress publish or web page. Before getting began, you most likely wish to create a well-formatted, neat PDF doc utilizing a PDF Editor. Then you’ll be prepared so as to add it in your posts with or with out utilizing a plugin. Let’s get began.

How to Embed a PDF File with a Plugin

There are quite a lot of plugins that you should use so as to add a PDF file to your WordPress publish.

However, we shall be utilizing a plugin referred to as PDF Embedder. It is a free plugin which is offered within the WordPress Plugin listing. The smartest thing about this plugin is it makes use of javascript to do its job and never some third celebration service or iframes.

Step 1: Install PDF Embedder Plugin

Log in to your WordPress Dashboard and go to Plugins > Add New. Now search PDF Embedder within the search field. Once you discover the plugin, simply set up and activate it. Simple, isn’t it?

Step 2: Setup the Plugin

Though you can begin embedding your PDF recordsdata when you put in this plugin, you may first modify the settings to make the embedded recordsdata look higher. To open the settings web page of this plugin, go to Settings > PDF Embedder from the left sidebar of your WordPress Dashboard.

PDF Embedder Settings

The free model of this plugin lets you change the next:

  • Width and peak – You can modify the width and peak of the PDF viewer. It accepts integer values (in pixels) or max (100% width).
  • Toolbar Location – The toolbar of this PDF viewer permits your viewers to zoom in or out and go to the following or earlier web page. You can have the toolbar on the prime, backside, or each.
  • Toolbar hover – You can choose whether or not you need the toolbar to be seen solely on mouse hover over the doc or not.

Now, these are the common settings. But what if you wish to change the settings of a selected file? Well, you are able to do that with the assistance of shortcodes. Here is an instance:

[pdf-embedder url=””  width=”500″ toolbar=”prime” toolbarfixed=”on”]

In the above instance, width is about to 500px, the toolbar location is about to prime, and the toolbar shall be mounted. You may set the toolbar to backside and toolbar mounted to off.

This plugin additionally has a premium model which affords options like obtain button, observe views & obtain, steady web page scrolling, and open hyperlinks in a brand new window.

Step three: Embed PDF file in Your Post or Page

Once you’re performed with the settings, you can begin doing the soiled work. Now, whether or not you’re utilizing the Classic Editor or the Gutenberg Editor, you may simply use this plugin to get the specified consequence.

If you’re utilizing the Classic Editor, embedding a PDF file is just like what you’d do for a picture or video.

First of all, create a brand new publish or open an present one after which click on on Add Media button. Now, add your PDF file, click on on Insert into publish button, and a shortcode shall be added to your publish.

Embed PDF file Classic Editor

That’s it – now you may preview your publish to test whether it is working correctly or not.

What about Gutenberg Editor? Well, the PDF Embedder plugin comes with a selected block. So create a brand new publish and click on on Add Block icon. Next, seek for PDF Embedder block and choose it.

Embed PDF file Gutenberg Editor

Finally, click on on the block to pick out (or add) your PDF file and your job is completed.

Here is the ultimate consequence, regardless of which editor you’re utilizing:

Embedded PDF file final

Popular PDF Viewer Plugins

Though PDF Embedder plugin does a very good job, it’s at all times good to have some options. So let me now share some free and premium PDF viewer plugins, in no specific order:

PDF viewer for WordPress

PDF viewer for WordPress Plugin

With greater than 3900+ gross sales, the PDF viewer for WordPress is the promoting PDF viewer plugin on CodeCanyon. It is a totally responsive and cross-browser suitable plugin. This plugin lets you allow or disable choices like print, obtain, zoom, web page navigation, and social sharing. You may use Google Analytics with WordPress to trace the variety of guests studying your PDFs.

Google Drive Embedder

Google Drive Embedder Plugin

Google Drive Embedder is a free plugin that lets you entry your Google Drive out of your WordPress dashboard and embed PDFs, Word paperwork, or spreadsheets to your publish or web page. However, to make use of this plugin, it’s a must to set up Google Apps Login as nicely – the aim of this plugin is to attach your Google Drive to your WordPress web site.

Algori PDF Viewer

Algori PDF Viewer Plugin

Looking for a Gutenberg block plugin for embedding PDF recordsdata? You can strive the Algori PDF Viewer plugin. This free plugin is suitable with each net browsers like Google Chrome, Firefox, Safari, Opera, and Internet Explorer 11. It lets you load a number of recordsdata in a single web page and helps presentation mode.

Real3D FlipBook WordPress Plugin

Real3D FlipBook WordPress Plugin

As the title suggests, Real3D FlipBook is a responsive and touch-friendly 3D flipbook plugin for displaying PDFs and pictures. It has been developed utilizing HTML5 and doesn’t require the usage of Flash. You can customise settings like flip velocity, flip sound, zoom stage, and digital camera angle. This plugin additionally helps lightbox and fullscreen mode.

Embed Any Document Plus

Embed Any Document Plus

Embed Any Document Plus is a one among its variety plugin that permits you to simply add and embed doc recordsdata (PDF, Word, PPT, Excel, and so on) simply on WordPress web sites. The plugin provides an ‘Add Document’ button above the visible editor. This will open up the EAD Plus popup from the place you may choose the supply of your doc. It is also tightly built-in with Google Drive, Dropbox and cloud providers. You can keep inside your WordPress web site and add recordsdata to the cloud providers and embed proper from there.

After importing or deciding on the doc, you wish to embed additionally, you will get an possibility to pick out which doc service you wish to select to embed your file. The plugin will acknowledge the file format routinely and recommend you the viewer. The viewers can deal with a file of most 5 to 8MB measurement. For bigger recordsdata, builders suggest to add them to Google Drive and embed from there.

How to Embed a PDF File with out a Plugin

Well, in case you are a kind of who’s at all times searching for options with out a plugin, then this part is for you. We can actually embed a PDF file in WordPress posts and pages with out putting in one more plugin.

The thought is straightforward – you’ll have to add your PDF file to your Google Drive account after which use the iframe code to embed that file in your web site. Though this technique is safe, the one drawback is it makes use of iframes.

Step 1: Go to Google Drive and log in to your account (simply join a free Gmail account to get 15GB of Drive area free of charge).

Step 2: Upload the PDF file which you wish to embed in your WordPress publish right here. To try this, click on on New from the left sidebar of your Google Drive account, choose File Upload, and add the file out of your native laptop.

Google Drive file upload

Step three: Once the file is uploaded to your drive, double click on on it to preview the file. Now, click on on the three vertical dots (More actions) current within the prime proper nook and choose Open in new window.

Google Drive: Open PDF in New Window

Step four: In the brand new window, click on on More Actions (the three vertical dots within the prime proper nook) and choose Share.

Google Drive: Share

Step 5: A pop-up referred to as “Share with people and groups” and “Get link” will open up. Here, click on on Change to anybody with the hyperlink within the “Get link” part. This makes certain anybody with the PDF file hyperlink can view it. If you don’t do that, the file will stay non-public and gained’t be seen to your web site viewers.

Google Drive: Share Settings

You ought to see the next affirmation:

Google Drive: Share Anyone

Once you do click on on Done.

Step 6: Now it’s time to get the embed code which we are going to use in our publish. To get that, once more click on on More actions, choose Embed merchandise.

Google Drive: Embed Option

Step 7: This will open a pop-up the place you may copy the iframe code.

Google Drive: Embed Code

Step eight: Head over to your WordPress Dashboard and create or edit the publish or web page the place you wish to embed the PDF file. Now, in case you are utilizing the Classic Editor, simply go to the Text tab and paste the code:

Classic Editor Text tab

For Gutenberg Editor, it’s a must to add a brand new block, seek for Custom HTML, and eventually, add the iframe code within the Custom HTML block:

Custom HTML Block

Step 9: That’s it – now preview your publish or web page to test your embedded PDF file.

Endnote on How to Embed PDF Files in WordPress

WordPress lets you hyperlink to your PDF recordsdata – however not embed them. However, this tutorial solves that drawback. It reveals how one can embed your PDF recordsdata in your posts or pages, identical to your pictures and movies, with or with out utilizing a plugin.

Have you ever embedded a PDF file in your web site utilizing any of the 2 strategies? Do you could have an alternate plugin in thoughts and consider that it’s higher than those talked about on this article? Let me know your ideas within the remark part.

Thank You