Blogger tip: add a link to any image with no HTML editing

February 01, 2017

When you insert an image into a Blogger blog post, it is usually linked to the larger original-sized image, which - when clicked - is viewable as a Lightbox overlay.
Sometimes you may want the image to link to a different web page instead.
Not sure what I mean?

Click to see a larger image:

Click to open my Blogger Tips Page on this blog:

If you are a HTML expert, you can switch the blog post editor to "HTML" mode and manually edit the image link.
But if you aren't comfortable editing your blog post code, you can add a web URL to the image with just few clicks.
Here's how you do it:

How to add a link to a Blogger blog image

1. Sign in to Blogger and open the post editor in Compose mode
2. Click the Insert Image icon

3. Add an image from any source (Upload, Google Album Archive, Phone (Google Photos))
Learn more about how insert photos and videos into a Blogger blog post in the Blogger Help Center.

4. Click the image once, and Link should be highlighted on the menu bar and you will see image formatting options.

Note "Link" on the top menu is highlighted blue

5. Click Link again to to remove the link to the larger image

6. Click the image again

Note that "Link" on the top menu is now NOT highlighted

7. Click Link again to open the Edit Link window

8. Enter a web address URL

9. Click OK to save the changes

Note that you will not be able to check the link on the blog post Preview by clicking the image.

Confusing?
Watch the video showing how to add a link to a Blogger blog post image.
For more tips on how to go beyond plain text in your Blogger blog post, watch my free webinar: Blogger: Beyond Text with Michael Daniels or watch my other Blogger tutorials.

LABELS: BLOGGERBLOGGER TUTORIAL

SHARE

Comments

1. 
   
   Sam NordbergFebruary 2, 2017 at 11:22 AM

   What a simple solution. I can't believe I never thought of this. Very useful tip for somebody like me who's been doing it the hard way all this time. Thanks for this.

   REPLY
2. 
   
   PlayliststorunJune 17, 2018 at 11:44 AM

   oh so easy..
   thnx a lot!
   savior!
   

   REPLY
3. 
   
   Edgar C. JonesNovember 11, 2018 at 10:19 PM

   Great post

   REPLY
4. 
   
   RickDecember 7, 2018 at 12:57 PM

   It IS easy. Thanks!

   REPLY
5. 
   
   Chukwuemeka HargleyFebruary 8, 2019 at 11:42 AM

   Thanks! I found this really helpful
   

   REPLY
6. 
   
   MarcoJune 28, 2019 at 11:56 AM

   awesome. If you link to a shared doc in a google drive, google refuses the connection unless you open in a new tab. How would you edit the link to force a new tab?

   REPLY
   Peggy KJuly 4, 2019 at 11:01 PM

   You can edit the link, and select "Open this link in a new window". That will add code to the link that opens it in a new window (or tab, depending on the user's browser settings).

7. 
   
   Lilly AnnJuly 30, 2019 at 10:25 PM

   Wow, Nice tutorial. This tutorial is very helpful for us. Thanks for sharing this great post.

   REPLY
8. 
   
   Ikal IchwanNovember 25, 2019 at 2:43 AM

   Many thanks for sharing.
   U're amazing!

   REPLY
9. 
   
   Anne RonskyJune 6, 2020 at 2:29 AM

   Fantastic, I bank you so much for explaining, this was exactly what I was looking for, appreciate your help :)

   REPLY
   Peggy KJune 19, 2020 at 12:29 PM

   I'm glad you found it helpful!

10. 
    
    Woodbank LaneJune 22, 2020 at 6:47 PM

    I've been blogging for years, and I am so glad to have found this!! Thank you so much!

    REPLY
11. 
    
    Aryan SinghJuly 11, 2020 at 1:41 AM

    I am doing the same what you have told but then also when I am clicking on image nothing is happening.
    Please help...

    REPLY
    Peggy KJuly 11, 2020 at 9:41 PM

    If it is the blog in your profile, it doesn't look like the images are linked. If you are using the new Blogger, try switching back to legacy Blogger and see if that works.