How to: Add a link to a button or photo

Upload the picture or button to your blog. You could also use an external picture host such as Photobucket, Flickr, or Picassa. But for this scenario we are going to assume you have loaded the picture in Blogger.

This is how the HTML looks when you upload the Knit1BlogToo button to Blogger:

<a href="http://photos1.blogger.com/blogger/7556/2731/1600/knit1blogtoo%20button%20re%20tutorial.0.jpg"><img src="http://photos1.blogger.com/blogger/7556/2731/320/knit1blogtoo%20button%20re%20tutorial.jpg"></a>

And this is what the world would see when viewing the post:



To change this to a button that links directly to a website, you need to add the website URL to the above HTML. Replace the red text...

<a href="http://photos1.blogger.com/blogger/7556/2731/1600/knit1blogtoo%20button%20re%20tutorial.0.jpg"><img src="http://photos1.blogger.com/blogger/7556/2731/320/knit1blogtoo%20button%20re%20tutorial.jpg"></a>

... with the URL www.knit1blogtoo.blogspot.com.

The HTML would then look like this:

<a href="http://www.knit1blogtoo.blogspot.com"><img src="http://photos1.blogger.com/blogger/7556/2731/320/knit1blogtoo%20button%20re%20tutorial.jpg"></a>

And the button will link to the website. To check, hover your mouse over the button on the PREVIEW screen and look in the status bar at the bottom of your screen. You should see the web address of the link appear.



Hope this helps. If you want to learn more HTML or what each piece of HTML means, do a search on Blogger Help or in the Blogger Help Group on Google.