BLogger Tricks Tips and nice turorials to use Blogger Effectively,Download Templates,widgets,Plugins.Change your blogger footer,header,navi.

Thursday, February 5, 2009

add icon to your posts

What's beauty if your image is shown near to all of your posts in blogger.Ya its amazing to see you with your blog title.
Here i let you know,
how to do that now?
It's very simple tasks,that you follow as i gave detailed instructions below;






1. CREATE AN IMAGE:

First step is to create a image either in an image editor or in an online image generator such as cooltext.com. Save it to your hard disk and upload it to a freehost.(www.photobucket.com) Then copy down its link/URL.



2. CREATING THE IMAGE CODE

The image code from your free hoster :


<img src="LINK OF YOUR IMAGE" style="border-width:0px" />


3. EDIT THE TEMPLATE FROM LAYOUT

Login to the "Dashboard" and click on "Layout" for the blog you wish to modify. Then click the Edit Html subtab of Template tab.
First backup the template.
Put a check in Expand Widgets Template box at the top of the template text box.


Scroll down till you come to the Blog Posts widget code. Locate this code :




<b:includable id='post' var='post'>

<div class='post hentry'>

<a expr:name='data:post.id'/>

<b:if cond='data:post.title'>

<h3 class='post-title entry-title'>

<b:if cond='data:post.link'>

<a expr:href='data:post.link'><data:post.title/></a>

<b:else/>

<b:if cond='data:post.url'>




4.If you want it to appear after the title paste the image code after this subsequent line of code :


code is:


<data:post.title/>



Preview and save Template.
Thats it yoyu have succesfully added your each posts with your own image.

Any question regrdingthis,please feel free to ask via comment.



.

0 comments:

Post a Comment

Post your comment,to hav more traffic to the site.

ShareThis

© 2011 Blogger Tricks and Tips, AllRightsReserved.

Designed by ScreenWritersArena