How to Embed PDF Files in WordPress Post and Pages

Home Guides How to Embed PDF Files in WordPress Post and Pages

Digital downloads are as much a part of the WordPress experience as content. While embedding PDFs within WordPress is relatively easy, users get at their wits end figuring out how to embed it properly within their site. If you’ve ever been in such a situation, or want to know how to embedding PDF files in WordPress, then look no further. 

This post will discuss the three methods you can use to embed PDFs within your WordPress post. 

Let’s begin with the very first. 

Method 1: Directly Linking Your PDF File 

We’ll start with the easiest way to embed PDF files on WordPress. Just link them! 

From your WordPress dashboard, go to Media > Add New.

From there, you’ll be redirected to the Upload New Media page.

Now, drag or upload your PDF file onto WordPress. Here, we have uploaded a PDF file from our computer.

Clicking on the Edit button at the right of the PDF File will lead you to the file editor.

Now, you can update the file by adding a caption and description. However, for our purposes, we want to copy the PDF’s URL by clicking on Copy URL at the corner. 

Now, visit Posts > Add New

This will open up the Gutenberg block editor, where you can create the new post. Give it a nice name and write “Download Now” or any other name you wish in the paragraph field. 

Now, highlight the “Download Now” text, and from the options, select the Link button as illustrated below. 

Now, add the link of your PDF file and embed it into the Download Now text. Now, we want the user to open the PDF in the new tab. To make that happen, check the “Open in new tab” button.

When you’re finished, you will see the “Download Now” button colored blue: indicating that it’s now a link. Click on Publish and View Post to continue: 

Inside the post, click on “Download Now,” and you will be redirected to the PDF file in a new tab.

Users reading this can Zoom In, Zoom Out, and scroll through the PDF file. 

Now, it looks as though the job is finished on the surface, but it’s not. You see, the link we’ve created works but is not as good visually. Chances are, your readers will sift through without even noticing it. 

In the next method, we’ll show how you can add visual design to the “Download Now” link. 

Method 2: Create a Button for your PDF Link 

This method is relatively simple in that it builds up from the previous method. 

Visually appealing buttons can prove extremely beneficial when it comes to getting a user’s attention. Converting your simple link into a button can make it appear more visible and possibly gain more downloads for your content. 

Here’s how you can do that. 

From your WordPress dashboard, visit the All Posts section and click Edit on the same post we worked on within the previous method. 

embedding pdfs in wordpress

Now, remove the “Download Now” block in the following manner. 

You will now find a plus (+) button in the empty fields that let you add blocks within Gutenberg.  

Click on it, and within the search bar, write “Buttons.”

When you click on Buttons, it will create a button within your document that looks like this.  

In the Add Text section, write “Download Now” and add the link in the same manner as the first method. Now, you won’t see the link text change in this method. The only way to check if your Button works is by updating and previewing it. 

Once you’ve done that, click on Update and View Post

Compared to the previous method, this embedding method looks a lot cleaner and inviting. Click on the link to see whether or not it’s working.

While Gutenberg makes it very easy to embed PDF’s into WordPress, some site owners might prefer to make users read PDFs within the website. Such a task is impossible using the methods mentioned above.

In the next method, we’ll be discussing how you can do such a thing with plugins.

New call-to-action

Method 3: How to embed PDF Files in WordPress Using the PDF Embedder Plugin 

In this method, we’ll be embedding a PDF file using the PDF Embedder Plugin. This one embeds differently in that it displays the PDF file within the post. 

The primary difference between the two is that if your readers decide to stay on the website, they contribute significantly towards reducing your bounce rates.  

So, without further ado, let’s see how you can work with the plugin. 

From your WordPress dashboard, visit Plugins > Add New.

This will lead you to the WordPress plugin store. When you’re there, search for “PDF Embedder” and select the one that’s from Lever Technology LLC.

Among its category, this plugin is the best you can find. Install and Activate the plugin to continue. 

Now, let’s go to the post we created in the second method. This time, we want to provide users with the option of both opening the PDF up in a new tab and reading on the web page. Because of this, we will leave the “Download Now” button as it is. 

embedding pdfs in wordpress

When you’ve added a new block, click on the Plus (+) button. You will see the option for embedding PDFs that looks something like this.

Click on it, and afterward click on the block to open up the PDF file you want to embed into the post.

Now, upload the PDF file.

Once you’ve inserted the PDF into the post, you will see the link appear inside the block.

When you’re done, click on Update and View Post. On our layout, it looks something like this: 

As you can see, we’ve embedded the PDF as well as the “Download Now” button link within the page. Yours could look very different, depending on your website’s layout. Either way, it will successfully embed the file within your page. 

You can now change the PDF viewer’s length and width by going to Settings > PDF Embedder. When you’re done, you can change the layout of the file the way it fits best.

Conclusion – How to Embed PDF Files in WordPress

In this article, we discussed the three different methods to embed PDF links into your WordPress post. In the first method, we just inserted a link, which didn’t look that good. In the second one, we created a button and linked it with the PDF location, which looked a lot better in terms of visual appeal. In the last method, we inserted the PDF reader within the WordPress page to ensure the reader stays on your site while reading. 

We hope this article helped you out. If you liked it, you should also read our articles on getting started with WordPress and the 40+ most useful WordPress shortcuts

Are you interested in getting your WordPress site developed? Don’t look further than our time-tested WordPress development services

Read Also

Tooba Nadeem

Tooba Nadeem is an experienced technical writer with 5 years of expertise in technical writing. Her extensive research and knowledge enable her to provide comprehensive insights into various interesting topics. She excels at presenting complex information in simplified language, ensuring clarity for the audience.

1 thought on “Full Stack Development: A Short Guide to Get You Started”

Leave a Comment

Your email address will not be published. Required fields are marked *