You have a WordPress site and would like to be able to embed and display PDFs on it? But you want to do this without a new plugin, if possible, because too many plugins slow down your website more and more? No problem, you can do without! We’ll show you how in this simple guide. And don’t worry, if you want to use a plugin, you will also find instructions below.
Why not use a plugin when you want to embed PDFs on your website
Certainly you can work with selected plugins to display a PDF document on your website. We will explain how in the last sections below. However, depending on the site, this is not necessarily advisable. Plugins increase the number of HTTP requests from your WordPress site, causing the site to load more slowly because it has to do more work when it is accessed. This can be disruptive for your users and, with a bit of bad luck, even lead to a higher bounce rate because users don’t want to wait.
However, some sites use so few (or even so many) plugins that it hardly makes a difference and in these cases a plugin can be quite useful and helpful. So that you can decide freely, in this article we will show you two ways of displaying PDF files on your website.
Why sould you display a PDF on the website at all?
There can be many reasons why you might want to display a PDF document on your WordPress site. Maybe you have an already finished document that you use for other purposes, but also want to integrate it on your website. PDFs are also very useful because these files always have the same layout – no matter what device they are viewed on.
So nothing changes in the smartphone display either. Also, by embedding PDF files in WordPress, you can share your files with your users while keeping visitors on your website as they won’t bounce off an external download link. However, this would be the case if you upload your PDF files in the “Media” section by default and add them to the WordPress post. WordPress in default mode does not display your PDFs, only the name and a link to your file. Your visitors can then access the PDF via the link and download it if necessary.
Conversely, this means that these users leave your site – which in turn leads to a higher bounce rate. Therefore, the better option is to embed your file in such a way that your visitors can easily view and access it directly on your page. How? You will find out in the following sections.
Embeding a PDF on your WordPress site
If you work with PDF files, you can save yourself a lot of work by merging the individual files if possible. You only have to upload one file and not several. For example, if you have several pages of a related document or folder, it can make sense to upload this data together. Here you can merge PDF files.
But whether one or more files: You can display the PDF directly on your page either with a plugin (which can slow down your page, as mentioned above), or as follows:
Step 1: Make sure your WordPress version is as new as possible. This technique may not work with some older versions.
Step 2: Go to the post in your WordPress backend where you want to add the PDF file for viewing.
Step 3: Here, click on the “Add Media” button, then click on the “Upload Files” tab, and then click on the “Choose File” button to upload the desired PDF file to your WordPress media gallery.
Step 4: Now go back to your post and click on the location where you want your PDF. Then click on “Text” in the upper right corner of your text editor.
Step 5: Now paste the following code into your text editor:
<embed src=”https://ww.example.com/demo.pdf” type=”application/pdf” width=”774″ height=”774″></embed>
Step 5: Now click Add Media, select the PDF file and copy the URL given on the right side. Then simply replace https://ww.example.com/demo.pdf with your own PDF file.
But rather with a plugin?
As mentioned above, you can of course also choose the other way and embed your PDF with a plugin. There are various ways of doing this, for example the “PDF Embedder”. This one uses JavaScript to embed files with a fully functional toolbar. Here, users can even zoom in and navigate within the PDF file. Another feature of this plugin is that the mobile version is optimized, so the display is just as good on smartphones as it is on laptops. To integrate your file with this plugin, do the following:
Step 1: Install and activate the PDF Embedder plugin.
Step 2: Go to “Settings” in the plugin. The default settings are already suitable for most websites, so this step is optional.
The settings allow you to control the height and width of the PDF viewer. You can also show the toolbar at the top or bottom of the viewer, or hide it entirely and only show it when the user hovers over the document. There are a few extras in the premium version. Now save changes and continue.
Step 3: Now embed your PDF in your WordPress post. This can be done either through the block editor or through the classic editor.
Paste in the classic editor:
Embedding a PDF file is just as easy in the classic editor. Again, start a new post or open the post you are currently working on. Again place the cursor where you would like your PDF to be. Now drag the PDF file onto your page and release the mouse button when you see the message “Drop files for upload”. The file is automatically uploaded to your media library and selected. So now all you have to do is click on the “Insert in Article” button and insert the PDF file on your page. The PDF Embedder adds a shortcode to your post. It looks something like this: [pdf-embedder url=”URLPDF”]. Now the PDF file will also show up here when you save the post and preview it.
Conclusion
By default, WordPress will allow you to link to your PDF files. We hope that this article will help you to know how you can easily embed PDF files on WordPress pages, posts, sections.
Feel free to check our Youtube channel or to check our blog to find out more information about Kubio Builder.