[Dummies Guide to Google Blogger Beta] Add Icon to Post Titles.

1 view
Skip to first unread message

vin

unread,
Apr 17, 2007, 6:52:54 PM4/17/07
to bloggerbet...@googlegroups.com
[http://betabloggerfordummies.blogspot.com/2007/01/linking-to-another-article-in-new.html]
Would you like to add a small graphic or icon to your post titles? Some members of Google Groups asked for this feature and here it is......

1. CREATE A GRAPHIC


First step is to create a graphic 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. Then copy down its link/URL.



2. CREATING THE IMAGE CODE


The image code is :

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

Replace the CAPS with the link of your image obtained in step 1.




3. MODIFYING THE TEMPLATE


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 uncustomized-post-template' expr:id='"post-" + data:post.id'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url' rel='bookmark'>

Paste the code you created in Step2 immediately after the last line in the above code. Preview and Save Template. See picture below of the icon next to my post title

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

<data:post.title/>

Preview and save Template.



--
Posted By vin to Dummies Guide to Google Blogger Beta at 4/18/2007 03:28:00 AM
Reply all
Reply to author
Forward
0 new messages