There may be times when you would like to embed a PDF file in your post or page:

  • A book author may want to give readers a free copy.
  • To add product catalogs to your website.
  • To share your creations in PDF format with your customers.
  • You can run a travel agency and want to display the itinerary of the tourist packages.

But there is a problem ! 

Although WordPress allows you to embed audios, videos, and of course, images, it is not possible to embed PDF files in your posts and pages. This feature is not available at this time, maybe it will be added in the future.

If you want to add PDF file, you can upload the file using option Add a media, insert it and the link to this file will be added to your page. And your visitors will be able to download it or view the file in the web browser when leaving your website.

But what if you want to embed PDF files in your articles and let your visitors see it without leaving your website? Is there a solution to this?

The short answer is YES.

So in this post, we will show you how you can embed PDF file into your WordPress posts or pages. Before you start, you will probably need to create a well-formatted and neat PDF document using a PDF editor. Then you will be ready to add it to your articles with or without using a plugin. 

But before, if you have never installed WordPress discover How to Install a WordPress Blog in 7 Steps et How to search, install and activate a WordPress theme on your blog 

Then back to why we are here.

How to add a PDF file with a plugin

There are a lot of plugins that you can use to add PDF file to your WordPress post.

However, we will use WordPress PDF Embedder plugin. This is a free WordPress plugin that is available in the WordPress Plugin Directory. The best thing about this plugin is that it uses javascript to do its job and not a third party service or iframes.

Step 1: Install the Embedder PDF plugin

Log into your WordPress dashboard and navigate to the menu Extensions> Add Search PDF Embedder in the search box. Once you find the plugin, just install and activate it. You can also discover our step by step guide on how to install a WordPress plugin.

Wordpress pdf embedder blogpascher plugin installation

Step 2: configure the plugin

Although you can start to embed your PDF files once you install this plugin, you can change the settings first to make them look modern. To do this, go to  Settings> Embed PDF from the left sidebar of your WordPress dashboard.

Parameter settings pdf embedder blogpascher

The free version of this plugin allows you to modify the following:

  • Width and height - You can change the width and height of the PDF viewer. It accepts integer values ​​(in pixels) or Max (100% width).
  • Bar location Tools - The toolbar of this PDF viewer allows your audience to zoom in or go back and go to the next or previous page. You can place the toolbar on top, bottom, or both.
  • Hover over the toolbar - You can select whether you want the toolbar to be visible only when the document is hovered with the mouse.

Now these are the universal settings. But what if you want to change the settings for a specific file? Well you can do that with the help of shortcodes. Here is an example :

[pdf-embedder url = "http://yoursite.com/wp-content/uploads/2019/01/April.pdf» width = "500" toolbar '"top" toolbarfixed "on"]

In the example above, the width is set to 500px, the location of the toolbar is set on top, and the toolbar will be fixed. You can also set the toolbar on the bottom and the fixed toolbar at the end.

This plugin also has a premium version which offers features like the download button, view and download counters, continuous page scrolling, and links opened in a new window.

Step 3: Embed PDF file in your post or page

Once you're done with the settings, you can start getting the job done. Now whether you are using the classic editor or the Gutenberg editor, you can easily use this plugin to achieve the desired result.

If you use classic editor, embedding a PDF file is similar to what you would for an image or video.

First, create a new post or open an existing post and click on the button Add media.Upload your PDF file, click Insert in the button publication, and a shortcode will be added to your post.

How to add classic wordpress editor blogpascher media

That's it - you can now preview your post to check if this plugin is working properly or not.

What about Gutenberg Editor ? Well, the Embedder PDF plugin comes with a specific block. So create a new publication and click on the icon Add block. Then find the block EMBedder PDF and select it.

How to add gutenberg blogpascher wordpress editor

Finally, click on the block to select (or download) your PDF file and your work is done.

Here's the end result, no matter which editor you use:

Display viewer pdf embedder blogpascher

Some popular PDF viewer plugins

While the WordPress PDF Embedder plugin does a good job, it's always good to have a few alternatives. So now let me share some WordPress plugins  premium PDF viewer, in no particular order:

1. DK PDF Generator

Creating PDF versions of your posts and sharing them in sharing communities can be a great option for traffic management.

Dk pdf generator

The premium WordPress plugin DK PDF Generator allows you to easily choose pages, publications as well as custom types of publication that can be shared or downloaded as PDF.

See our article on 30 things to do on your blog posts after they are published

With these, you can even add a cover and table of contents (with interactive links) to your PDF file.

Download | Demo | Web hosting

2. PDF Product Catalog for WooCommerce

It is a very useful premium WordPress plugin from WooCommerce, which will help you to download the complete list of products from your online store in PDF format.

Pdf viewer for wordpress

This plugin comes with five default PDF templates, but you can create your own according to your needs with simple HTML and CSS.

Read also our 9 WordPress plugins to manage your product catalog

It also provides you with a shortcode creation and insertion option to add PDF download buttons to any article or page.

Download | Demo | Web hosting

3. WordPress social sharing and print post page to pdf plugin

This premium WordPress plugin is leaving exclusive WordPress social sharing plugins, the simplest, and optimized with great features that you will see by consulting its demo. It offers many features such as full sharing of a blog post or web page on any social network, and downloading these in PDF format.

Wordpress social sharing and print page post to pdf plugin

With this WordPress plugin you will be able to easily redirect website visitors to your social media accounts and increase your presence On the latter.

Download | Demo | Web hosting

How to add PDF file without plugin

Well, if you are one of those who are still looking for plugin free solutions then this section is for you. We can certainly add PDF file in WordPress posts and pages without installing yet another plugin.

The idea is simple: you need to upload your PDF file to your Google Drive account, then use the iframe code to embed this file into your website. Although this method is safe, the only problem is that it uses iframes.

Step 1 : Go to Google Drive and sign in to your account (you just need to sign up for a Gmail account to get free of charge 15 GB of space).

Step 2 : Upload the PDF file you want to embed in your WordPress post. To do so, click on New on the left sidebar of your Google Drive account, click on Import a file and upload the file from your computer.

Import file google drive blogpascher

Step 3 : Once the file is uploaded to your google drive, double click on it to preview the file. Now click on the 3 vertical dots (More actions) present in the upper right corner and select Open in a new window.

Open new window google drive blogpascher

Step 4 : In the new window, click on More actions (the 3 vertical points in the upper right corner) and click on Share.

Google drive blogpascher

Step 5 : A pop-up called "Share with people and groups" and "Get a link" will open. Click here on Edit to anyone with the link in the "Get a link" section. This is to ensure that anyone with the PDF file link can view it. If you don't, the file will be kept private and not visible to your website audience.

Sharing people groups blogpascher

You should see the following confirmation:

Get link google drive blogpascher

Once it's done, click Completed.

Step 6 : Now is the time to get the embed code that we are going to use in our post. To get this, click again on More actions, select Integrate an element.

Integrate element google drive blogpascher 1

Step 7 : This will open a pop-up window that allows you to copy the iframe code.

Google drive copy code integration

Step 8 : Go to your WordPress dashboard and create or edit the post or page where you want to embed the PDF file. If you use classic editor, just go to the Text tab and paste the code:

Paste classic editor code blogpascher

To Gutenberg editor, you need to add a new block, search for custom html, and finally, add the iframe code in the custom HTML block:

Personalized html insertion gutenberg editor blogpascher

Step 9 : That's it: now preview your post or page to check your PDF file.

Summary

WordPress allows you to attach your PDF files, but not to embed them. However, this tutorial fixes this problem. It shows how you can embed your PDF files into your posts or pages, just like your images and videos, with or without using a WordPress plugin.

Discover also some premium WordPress plugins  

You can use other WordPress plugins to give a modern look and optimize the grip of your blog or website.

We offer you here some premium WordPress plugins that will help you do that.

1. Backup And Restore

Backup And Restore is a premium WordPress plugin that will help you schedule your website backups to a local server or to different cloud servers such as Dropbox, Google Drive and Amazon S3. You will therefore be able to restore your entire website, including the database, from existing restore points with just one click.

Backup and restore

Downloading your website, database and all your backups will also be possible. This plugin will also help you manage the backup and restore processes in a simple, secure and reliable way.

Its features include: full website backup, Amazon S3 backup, Google Drive, dropbox, the disk space manager, the auto-deletion of old backups, the complete restoration of your website, support for multisiteEtc. ...

Download | Demo | Web hosting

2. Yellow Pencil: Visual CSS Style Editor

Yellow Pencil is a visual style editor that you can use with any theme to personalize your website in minutes (fonts, colors, animations and more…).Yellowpencil visual css style editor wordpress plugin

This premium WordPress plugin will create CSS styles in background while you play with the colors as if it were a game. It was designed for beginners as well as experienced users.

Discover also our 5 plugins WordPress to show notifications

No coding knowledge is required. However, the WordPress plugin has a good CSS editor for those who like to code. You can code live with this editor and customize your CSS.

Download | Demo | Web hosting

3. Quack Chat Live Chat System

Quack Chat is a premium WordPress plugin that easily integrates into your website and offers a user-friendly interface for your customers. It is an online chat that can be used from any computer or mobile device.

Quack chat live help support system for wordpress

As functionalities it offers among others: support for instant notifications via messages or emails, an audible notification system, automatic archiving (history) of chats, a user-friendly control panel, a customizable chat window, an automatic and customizable greeting message, support for automatic scrolling on the chat page etc ...

Download | Demo | Web hosting

Recommended Resources

Find out about other recommended resources to help you build and manage your website.

Conclusion

Here ! That's it for this tutorial. We hope this article has helped you embed PDF files in WordPressDo not hesitate to share with your friends on your favorite social networks

However, you can also consult our resources, if you need more elements to carry out your projects of creation of Internet sites, by consulting our guide on WordPress blog creation.

If you have suggestions or remarks, leave them in our section Comments.

... 

0 shares
Share
tweet
Save