Adding linked images.

Have you ever wanted to add a linked image to a blog post, page, or your sidebar? Here is a tutorial that show you how to do just that. It's pretty simple and easy. This also works well if you want to customize your header menu with images. To use any of the codes, just copy and paste them into an HTML editor or blog post. You can also use the source code of this page using inspect element, if you know how to do that.

First, you will need to either create an image or find one and download it to your computer. If you are download an image make sure you either have permission to use it or it is licensed under a Creative Commons license.

Secondly, upload it to a image sharing website. I recommend Imgur and Photobucket.

Thirdly, copy the direct link and paste it in the following code here it says add image URL. Also add the link where you want the image to go to where it says add link URL. I have added an example of how it could look below.

<a href="LINK URL HERE"><img src="IMAGE URL HERE" title="ANY TITLE HERE" /></a>

 Here is an example of how it could look:



That's it. :) You have successfully made a linked image. Now, to add it to a post you will need to be in HTML mode, paste it in, and then you can go back to compose. If you are adding it in a sidebar make sure to be in "code" mode, not "rich text".

Here is a quick screencast I have made on how to add a linked image to a blog post:

Some common questions:

How do I center it?

Add the <center></center>   tags around the entire code.

Can I create a non-linking image? 

Sure, just use  <img src="IMAGE URL HERE" title=" ANY TITLE HERE" /></img>

If you need any help, let me know below and I will try to help.

QOTD: Have you used this on your site?