How to link an image with WordPress
You can link images in your wordpress posts or pages to any URL or file. You might want to link to another website or you might want to link to a PDF or other file you have on your site. This short tutorial will show you how to do both.
First, we are going to link an image to another website.
- Go to the post or page you’d like to insert a linked image.
- Place your cursor and select the “add image” button.
- From here we are going to concentrate on the “Link URL” section.
- Right now you’ll notice that the link URL area is populated with the absolute path of the image we have chosen. If you choose “none” your image will not link to anything when clicked. If you choose “file URL” it will link to the original image you’ve uploaded in it’s original size. If you select the Post URL, it will link to the post or page that the image located in.
- We want this image to link to another website. So, we are going to replace the link with our own.
- Copy the URL to the page you want to link to and go back to my “Add an image” area and paste that URL into the “Link URL” area.
- Select “insert into post”.
- If you click “preview changes” you will see what the page will actually look like and test it to make sure it goes where I want to.
Next, we are going to take the same image and link it to a PDF file.
- First we need to upload a PDF.
- You can place your cursor anywhere because we aren’t actually going to place it. We just want to upload it to WordPress.
- Select the “Add Media” button and find and upload your PDF file the same way you did your image earlier.
- This time, you want to click the “file URL” button. When you do, you’ll see that the link to the file will be populated in the space above. Copy that URL and close the window.
- Now, click on the image that you want to link the PDF to and select the “Edit Image” button.
- Where the Link URL appears, paste the URL of the PDF that we just copied.
- Now, click Update.
- Preview the page again to see your changes. When you click the photo it should bring up the PDF that you linked to it.
{ 5 comments… read them below or add one }
Dear Lena,
I have searched and searched(2+ hours) for an answer to a basic question with wordpress. How do you link a file from filezilla to the link on wordpress? I want to link the kid’s track club records to a pdf file. I highlight the name of the age group, click on the link button, goes to small link page but I can not access the ftp file. The files are on the ftp site. Is there any way to upload all the pdf files and others straight to the wordpress sites and not use the ftp function. I have a bunch of pdf files that I would like to use in wordpress. The person who made the site has some pages already linked to the ftp but we can not seem to do it and they are unavailable currently. Thanks from a frustrated teacher and coach.
FTP is “file transfer protocol” and doesn’t normally have the ability to link to files from the FTP. Also, any time you upload or download a file whether it be through filezilla, Wordpress, Dreamweaver, Cyberduck, etc. you are using FTP. As i said, it just means “file transfer”. So, you’ll need to download the files from the FTP and upload them to your Wordpress site somehow.
You can go to the media section (or upload from inside a post etc.). That being said, if you have a ton of PDFs, you might want to just use FTP to upload all the PDFs into a folder on your computer at once. If you had 20 PDFs, this would be much quicker. Then you could just go back to your post and put in the correct path to each PDF.
Hopefully, that was helpful. But, feel free to respond back or shoot me an email if you have further questions.
(:
Hello Lena,
I created a custom theme in Photoshop. Wrote the HTML and CSS and validated both. Works perfectly as a static site. Now trying to transfer to wordpress so I can host it at Hostgator. Here is my problem. I took a blank theme I found with all the requisite files. Copied my images to the file “images”. Transferred my CSS called styles.css to the new theme folder. When I try to link to my images that are in the same folder as the rest of my site info, I get nothing. I am told I should use absolute links. What exactly is it. Do I use my theme name as the Theme URI? Do I find the path by clicking on the image in my images folder? What? No one seems to have an answer nor be able to articulate one. Most coders appear to be communication challenged. Turning out to be a pain. Might as well go to a dynamic site using PHP and MySQL as this wordpress thing is getting ridiculous. Any suggestions will be greatly appreciated. Thank you
Om,
This is going to take a longer answer. I will email you with some details. (:
thanks =) !