Don’t you want your blog look beauty? Maybe you can add several accessories. One of them is adding a small image beside post title.

How to adding a small image at the post title? here is the steps.

Step #1

You must have a small image image.

Step #2

Upload your small image to image hosting. For example : you can upload your image to blogger, Yahoo geocities, Google pages, or another free image hosting. If you has been uploading your image, please get the image code. for example : I'm has been upload an image to Blogger and the image code is :

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz5eeusmZDjOutO0OfEhYv3OiLEQZA040rQ3xHQ4Gj1eiDZfU29R0HOJ7_iYBs5uPN-dH12R5jyookdcY9_p0m9qeWZG_Yzdcl6fn960MGNi1LGOGc1xe37cIxVRF4-XySftLoxqw-_No/s400/mypencil.jpg

So that the picture can appear at your blog, you must create the code like this :

<br /><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz5eeusmZDjOutO0OfEhYv3OiLEQZA040rQ3xHQ4Gj1eiDZfU29R0HOJ7_iYBs5uPN-dH12R5jyookdcY9_p0m9qeWZG_Yzdcl6fn960MGNi1LGOGc1xe37cIxVRF4-XySftLoxqw-_No/s400/mypencil.jpg" /> <br />

Step #3

Add the image code to your template code. Here are the steps to add image code to your blog.


Or, do you still using old (classic) template? Never mind, bellow is the steps adding image code to classic template :

1. Login to blogger with your ID.
2. At the dashboard page, click Template.
3. Click Edit HTML.
4. Back up your template code (important!).
5. Find this code :

<blogitemtitle$>

6. Replace your image code beside above code :

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz5eeusmZDjOutO0OfEhYv3OiLEQZA040rQ3xHQ4Gj1eiDZfU29R0HOJ7_iYBs5uPN-dH12R5jyookdcY9_p0m9qeWZG_Yzdcl6fn960MGNi1LGOGc1xe37cIxVRF4-XySftLoxqw-_No/s400/mypencil.jpg" /> <blogitemtitle$>

7. Click Save Settings button.
8. Done. Now your every post title will appear with your small image.



This is for new blogger template (beta template) :
1. Login to Blogger with your ID.
2. At the dashboard page, click Layout.
3. Click Edit HTML.
4. Back Up your template code (important!).
5. Please mark the little box beside Expand Widget Template. Wait for a moment
6. Go to your template code, and find the code like this :

<br /><a href="'data:post.url'"><data:post.title/></a>

7. Add your image code like this :

<a href="'data:post.url'"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgz5eeusmZDjOutO0OfEhYv3OiLEQZA040rQ3xHQ4Gj1eiDZfU29R0HOJ7_iYBs5uPN-dH12R5jyookdcY9_p0m9qeWZG_Yzdcl6fn960MGNi1LGOGc1xe37cIxVRF4-XySftLoxqw-_No/s400/mypencil.jpg" /> <data:post.title/></a>

8. Click SAVE TEMPLATE button.
9. Done. Now your every post title will appear with your small image.


All right brothers, see you at my next tutorial.

Feel interesting for this post? Please Digg it!.