Tutorial Tuesday - Set Images/Photos as Links

I got asked this the other day so I thought I'd do a quick post about it. This can be used for buttons, photos...any image that you want to link to somewhere else, be it another website, a blog post, a certain label, anywhere.


Layout > Add a Gadget > HTML/Javascript.

The code

<a href="URL LINK" target="_blank"><img src="IMAGE DIRECT ADDRESS/LINK" border="0" alt="DESCRIPTION"></a>

URL LINK - The link to the post/tag/label/website or whatever it is you want to link to.

IMAGE DIRECT ADDRESS/LINK - The address/link of the image itself, should be hosted somewhere such as shutterfly, tinypic, photobucket, flickr, etc.

DESCRIPTION - Of the Link/Image.

Add Multiple Images

To add another image, simply add it again underneath so it looks like...

<a href="URL LINK1" target="_blank"><img src="IMAGE DIRECT ADDRESS/LINK1" border="0" alt="DESCRIPTION"></a>

<a href="URL LINK2" target="_blank"><img src="IMAGE DIRECT ADDRESS/LINK2" border="0" alt="DESCRIPTION"></a>

It's that simple!

You can see a table of contents of all tutorials here & learn how I used the above coding to make social media buttons that change once you hover over them here.

Hope this helped some of you :)