4 Easy Steps to Embed a PDF in WordPress
Table of Contents
PDF files are a homestay of the Internet. Longer documents, calendars, forms, and more are often linked to on sites to save space and not ruin the site’s theme. Embedding PDFs in WordPress sites allows you to show the contents to users right on your site so they don’t need to hit a link and open it up in a new tab. Remember, this will decrease your bounce rate and make for a much cleaner site design!
We’ll go step by step through the process, all the way from how to upload a PDF to WordPress to using a WordPress PDF plugin. Using the free version of WordPress.com that disallows plugins or would rather not install one? No worries, we’ll also show you how to embed a PDF in WordPress without a plugin!
In a rush? - Watch this video
how to Embed a PDF in WordPress (Video)
in 4 easy steps
Embedding PDFs in WordPress
In our tutorial, we’ll take a sample PDF file, upload the file to your site, and embed it! In less than ten minutes, you’ll be a pro! Let’s get started.
Step 1: The Prerequisites to Embedding PDFs in WordPress
First, you’ll need to log into your WordPress Portal as the administrator. Once you’re on the Portal, you’ll need to make a new post by clicking the “Add New” button:
Next, prepare a sample post to use. You can either click “Publish” or “Save Draft”. This is the page where we’ll practice embedding PDFs in WordPress!
Hit the “Dashboard” link in the left column to go back, since that’s where the next step will begin.
Now it’s time to choose your own adventure! If you want to use a plugin for embedding PDFs in WordPress, go on to “Step 2” and skip “Step 4”! If you want to embed a PDF in WordPress without a plugin, skip “Step 3” and go on to “Step 4”!
Step 2: Grab a WordPress PDF Plugin
After a careful review of the plugins available for embedding PDFs in WordPress, we found that you’ll get the most versatility out of Lever Technology’s “PDF Embedder” plugin. It uses a unique mechanism to show the contents of a PDF file on a WordPress page without iframes or the browser’s native PDF file reader.
In short, this plugin dodges the (unfortunately very) common situation where users can’t see your PDF file because their browser automatically blocks it, depending on security settings. You get the best of both worlds: the ability to display a PDF file and not worrying about users needing to download it manually!
First, from the Portal, click the “Plugins” item in the menu on the left-hand column:
On the page that comes up, you’ll need to click on “Add New” as shown:
You should then see the plugins library page. In the “keyword” search box, type in: “pdf embedder”, and you should get a pack of results as shown below. Hit “Install Now” on the proper plugin. It is the one that has its “Install Now” button boxed in red.
Next, that “Install Now” button should take a few seconds, then its text should say “Activate”. Click on the button again. Then, you’ll be redirected to the page that shows the plugins that are currently on your WordPress site. Verify that “PDF Embedder” is present on that list.
Step 3: Using the Plugin to Embed a PDF File
Now that you’ve successfully installed the “PDF Embedder” plugin, it’s very easy to embed a PDF file in our sample post. You’ll first need to return to your Portal by clicking the “Home” button.
Next, let’s locate our sample post. On the Dashboard, click on the “Posts” link on the left-hand column menu as shown:
Then, you’ll be presented with a list of all of your posts. Find the one you most recently created for this tutorial in the list. Then, click the title you created for that post to access its contents.
We will now need to make a new “Content Block”. As shown in the picture below, click on the button with a “+” sign on it.
You’ll then get a popup as shown in the next image. In the search box that is boxed in red, just type “PDF”. That should only yield a few results. You’ll need to then click on the item boxed in yellow that says “PDF Embedder”. This calls the plugin we just installed and enables us to drop that PDF in our site!
A Content Block will then be created. Yes, the layout is a bit odd, but bear with us! It will just look like a box with some text in it that says “Click here to Open Media Library to select PDF”. Click on that text, and then you should see your current media library. We will now have to upload a sample PDF file.
The “Upload Files” tab will be selected by default. In case you don’t know how to upload a PDF to WordPress, it’s quite simple. You can either click the “Select Files” button boxed in yellow, or you can simply drag and drop a PDF file from your File Explorer!
Once the PDF file is finished uploading, you will see a small document icon and file name like in the yellow box above. You can optionally fill out the fields we pointed to with red arrows if you want to be able to find that PDF file in the future. Be sure to click “Select” to continue!
You should then get something that looks like the image below.
You may have to tweak the sizing, but that completes the process! You now have completed the process of embedding PDFs in WordPress by using a plugin.
Step 4: Embed a PDF File Without a Plugin
This step is only meant for those who did not follow “Step 3”. It covers embedding PDFs in WordPress without using any plugins.
Please note that this method may cause the content to be blocked by certain browsers!
First, access the sample post we made in “Step 1”. You’ll need to go to the Dashboard’s “Home” and then click the “Posts” item on the menu as shown below.
We will be using Google Docs for this. After logging into your Google account, access your Google Drive and upload your sample PDF file. Right-click on that file, and then select “Open With -> Google Docs” on the menu to get started!
Once you have the file open in Google Docs, on the top toolbar, click “File -> Publish to the Web”. You should see a dialog box like this:
First, you need to hit “Publish” so that others can view the file. Then, select the “Embed” tab in yellow. Copy the HTML code that appears in the textbox. Going back to your WordPress sample post, we’ll need to add a new Content Block.
Type “Custom HTML” in the search box that comes up. Select that option, then you should see something like this:
Simply copy and paste the HTML from Google Docs inside the box there, and you’re good to go!
As you’ve seen, embedding PDFs in WordPress can be a tedious process. There are only two real routes: using a plugin or using a service like Google Docs. In general, it is a better idea to use the plugin, since it’s more likely to work universally, and it references content that is stored locally in your WordPress media library.
A service like Google Docs usually will provide you with “iframes”, which are generally frowned upon in web design, and some browsers will fail to display them. Regardless of which path you choose, you should now be confident in your ability to embed those PDF files!
In summary, here’s what you have to do to embed PDFs in WordPress:
- Log into your WordPress Portal.
- Make a New Post, then save or publish it.
- Install the “PDF Embedder” plugin.
- Insert a new Content Block into your post.
- Click on the “PDF Embedder” option for your Content Block.
- Upload a PDF file by clicking on the content block.