Adding Hyperlinks to Images on WordPress Pages and Posts

This post may contain affiliate links. Please read my disclosure for more info.
Featuring Blog Posts on Your Word Press Home Page
February 13, 2018

Adding Hyperlinks to Images on WordPress Pages and Posts

Adding Hyperlinks to Images on WordPress Pages and Posts

So let’s assume you just created a new blog post and you have added an image. This may be a post where you are wanting the user to click the image in order to view a product on another website that you want them to buy (affiliate marketing) or it may just be a link to a different page on your site or another website. There is a way to add links to your images that is correct and then there are ways to add images to your images that is not correct. We will discuss both.

Adding naked links to images

We will demonstrate how add a link to an image even though the link may look quite strange (see also spammy or scammy). This is very easy to do. Here’s how:

  1. Do you have a destination where the user will be taken once the link is clicked
  2. Copy the destination’s link
  3. Edit your page and single click your image
  • Click the paperclip icon (1) to add a link to the image
  1. Insert/Paste the link into the box (2)
  2. Click the Enter button (3)

Recommended Option:
Instead of clicking the Enter button, click the Link Options button instead. This open the Edit Link dialogue box. I simply recommend checking the box to “Open link in a new tab”. This way the user doesn’t leave your site. Be sure to click the Update button.

For a number of links this is a perfectly fine way to add links, but if you are adding a link to an affiliate product this isn’t good. The link will definitely look a LOT different.


In the example, see how it looks kind of weird. This may scare your potential customer away. To be honest, this link doesn’t look as scary as a number of other affiliate links I have seen.

Adding Safer Looking Links to Images

I highly recommend the use of Pretty Links on WordPress. It is a plugin that you download and activate. Once active you can easily take your affiliate links or whatever links you have to other locations and turn them into much friendlier links and links that are easier to remember.

Here’s how:

  1. Download and Activate Pretty Links
  2. Click the Pretty Links icon in the left navigation panel
  3. Click the Add Pretty Link button
  4. Update the following fields:
    1. I like to add permanent links so I always use the 301 Permanent Redirection option
    2. Enter your Target URL…type or paste the link that is the destination where to send your reader
    3. Add a descriptor for your pretty linkLet’s assume I want to send someone to where a candle is being sold and the affiliate link looks horrible. What I would do is add CANDLE to the descriptor field so now my pretty link will look like this:
    4. I give me link a title
    5. Click the Create button

Now that you have your link, follow the same instructions for adding a link to your image as described at the beginning of this post. Just insert your pretty link instead of the other link.

That’s it. Very Simple! Just the way I like it.


Adding a Hyperlink to an Image in the Sidebar Widgets

In a previous post, I demonstrated how to add in image to your Sidebar Widgets. Now I am going to show you how to add a hyperlink to that image.

First let’s review:

Add an Image into a Widget

  1. Click the Media>Library link in the left navigation panel to open your Media Library

This is library of files that you have uploaded to your website (images, documents, pdf, etc…)

  1. Click on a specific image from the library
  • Copy the URL of the image



This allows you to copy the images file location. Now we will go to the Widgets and add the file to one of our widgets.

  1. Click the Widgets link under the Appearance heading in the left navigation panel
  • Add a Text widget to your Sidebar
  1. Open the Text Widget and click the Text tab
  2. Add the following and then click the Save link

<img src=”The Link To Your File”>



Now let’s take it a step further an add a link to the image.

  1. Make a copy of your Pretty Link
  2. Open the Widget and click the Text tab
  3. Let’s Assume our pretty link is the same as before
  4. What we want to do is wrap our pretty link around it
  5. Enter this code:

<a href=””>

  1. Then we insert our image code from before

<a href=””><img src=”” />

  1. Then we add a closing to the link
  2. I will also add some text like Click Here Now!!

<a href=””><img src=”” /> Click Here Now!!</a>

This is the finished product:

This is now a hyperlinked image on our sidebar and will take the reader/viewer to where you want them to go if they click the image or the text that says, “Click Here Now!!”.








I hope this was helpful.

Similar Posts:

    None Found

I am the owner of Fidelity Square-Rodney Moody (A father of six, a deacon within my church, active in coaching and supporting youth sports and Special Olympics). Seems like I have always been a teacher (Special Education, Emergency Management, and Technology. I love teaching and helping others. My website is dedicated to helping others to be successful online.

Leave a Reply