This post will cover how you can link an image to another file, such as a PDF in this specific case, that you have in your media library. For this example, we’ll show you how to:
- Upload the PDF file into your library
- Insert an image into your blog post that links to this PDF
First things first, we’ll deal with uploading the PDF:
- The first thing you want to do once you’re in the WordPress admin panel is expand the Media tab and click add new.
- From here, navigate to where the file is located. In our case, the PDF file is located on the desktop in a folder called “Tutorial”.
- Complete the information fields (if you want, this is optional but recommended).
- Copy the file link -[Ctrl + C] It will end in .pdf like this: https://wpbarista.com/wp-content/uploads/2011/07/sample.pdf.
- Once you’re done that, go ahead and click the “Save All Changes” button.
Once that’s done, you’re finished with uploading the PDF file. Next, we’re on to inserting the image into your post and linking it to the file we just uploaded. Head on over to the add new post tab.
Now that we have our PDF file uploaded, we can go ahead and add our image in the post. To do this we’ll start by clicking the little “Add an image” button just above the WYSIWYG toolbar. Once you click it, you’ll see a new window pop up that lets you
- Add an image from your computer
- From a URL
- From your existing media library
Once you’ve uploaded the image, take note in the screenshot of the highlighted orange field; that is the field we want to put the link in. By default, it’s setup so that when you click on the image, it’ll take you to a full size version of the image. We want to change this so that it links to the PDF we uploaded earlier.
Remember when we copied the PDF link? You’re going to need that now! Paste it into this field as shown. [Ctrl + V]
After that’s all done and you’ve figured out what alignment and other options you want on this, go ahead and click “Insert Into Post”. The window will disappear and you’ll see the image in your WYSIWYG editor properly linked to the PDF.
When everything is said and done and you preview/publish your post, you’ll see your image and it should be linked right to the PDF like the example below: