Learn How To Create Picture Link In Posts?

Create Picture Link In Posts

In this tutorial i will tell you how to create picture link in your post. By default when you click on any image it opens in a light box. But if you want that when someones click on the picture then a new page or website gets open. If you want to do so then this tutorial can help you. It actually involves changing the HTML code which is very simple. so lets start. (Click on the below picture it shows the final result. It will link you to the Facebook fan page of this blog)

1. First upload the desired picture to blog post by the same procedure as you do. When you have uploaded the picture then click on the HTML after that some coding will appear like shown below

<div class="separator" style="clear: both; text-align: center;">

<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjln_ayBeY1iDXpx890hL61kdGtCK-Ab_n_HWwV-4lXy4RJzdB5JG0iR56vLpk4u24fLhyphenhyphenF4N0mtk15xrYajklXvyaLtpqwNz2ffH5RqFNPPv1E8Hi9bigPyLvDcTmHbvBlF-nyUDWLWy_l/s1600/WelcomePurplePink.gif" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="257" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjln_ayBeY1iDXpx890hL61kdGtCK-Ab_n_HWwV-4lXy4RJzdB5JG0iR56vLpk4u24fLhyphenhyphenF4N0mtk15xrYajklXvyaLtpqwNz2ffH5RqFNPPv1E8Hi9bigPyLvDcTmHbvBlF-nyUDWLWy_l/s320/WelcomePurplePink.gif" width="320" /></a></div>

2. This code includes two links one with blue color and the other with red color. Your code will also be like this. We will use the first link which is with blue color. The first code which is with " href " its actually the main link the other one with "src" this is  the source code which we will not use.

3. Now comes the main step. Now what you have to do is just simply change the first link which is in blue color with your desired URL. as shown below

<div class="separator" style="clear: both; text-align: center;">

href="http://www.facebook.com/microhelps.blogspot/"

4. Do not change any other code just simply replace the first code with your desired URL. By doing this when some one will click on the image it will open the targeted URL. If you want that the website should be opened in new tab then simply add  target ="_blank" just after the link address. It will looks like this

<div class="separator" style="clear: both; text-align: center;">

href="http://www.facebook.com/microhelps.blogspot/" target="_blank"

That's it now return to compose mode and publish the post.