How to Create Image Links on Your Blog

written by:
posted on: January 21, 2018

For most bloggers, the only real piece of code you need to know is how to add image links. Ads, buttons, profile pictures, or featured categories use image links. If you want to add a profile picture that links to your about page, this tutorial is for you!

What are image links?

Image links are any image which links to a different web page (URL). These hyperlinks are images that you can click on, and they take you to another web address. Tags represent hyperlinks. 

<a href="URL OF LINK"><img src="IMAGE URL" alt="Description of Image"></a>

HTML Basics:

  • href attribute specifies where the link is going
  • <img> attribute specifies what the link will look like, in this case, an image!
  • “alt” describes the image for screen readers and allows you to improve your SEO (ever so slightly) by assigning text to the picture.

How do I create image links?

To create images links you will need the following:

  • URL OF LINK: where you want the image to link to
  • IMAGE URL: When uploaded to your site, all images have a URL associated with them. Your image should be sized appropriately. If this is an image to be used in the sidebar, you want it to be approximately 300px wide (but this depends on your theme).


  1. Upload your image to your WordPress Dashboard, by going to MEDIA < ADD NEW.
  2. Once you upload the image, select EDIT.
  3. A new window will pop up with information about your image, including the URL. Copy this URL it is your IMAGE URL.
  4. Using the structure below, replace – URL OF LINK, IMAGE URL, and Description of Image with the respective examples. I’ve included an example below.
<a href="URL OF LINK"><img src="IMAGE URL" alt="Description of Image"></a>

Replaced with Examples:

<a href=""><img src="" alt="White Oak Creative Blog Shop"></a>

If you want your image to open in a new window, set the target for the link. Add target=”_blank” to your <a href> attribute. If you do not set a target, the link will open in the same browser.

<a href="" target="_blank"><img src="" alt="White Oak Creative Blog Shop"></a>

You’re set!

With that example, you still might prefer something code-free. That’s fine! Jetpack comes with an Image Widget feature that allows you to add specific information and links to your image.

Editor's Note

Some of the links included throughout this website are affiliate links, which means that Lindsay Humes LLC receives a small commission when certain items are purchased. These affiliate links provide a means for the site to earn revenue and generate free content for readers. For more details, read the privacy policy here.

Blog Design Lindsay Humes
Meet The Author: Lindsay Humes

Leave a Comment

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

Join The Blog Better Audit!

Subscribe to join thousands of other creatives, bloggers, and freelancers and receive my free email course on how you can improve your WordPress website. My newsletter is full of tips on how you can grow your audience with actionable exercises that do not require a designer or developer!