Tuesday, December 28, 2010

Adding Picture to Post Title

0 comments
Blog Post will looking good with adding some picture or image. How about Post Title? Can we adding image or picture too? Of course we can. Like this blog, you can see picture in the left of post title. You can put any picture you want, like your face photos maybe. This Blogger Trick can only put same picture on every post title. So, choose the best picture you want like animation gif image. About the size, don’t too bigger more than post title font size. Because can make your post title invisible. Ok, if you want Adding Picture to Your Post Title, please follow these steps:

1. Prepare your picture (you can put animation too)
Example:


2. Save the picture by upload your picture to your hosting (like photobucket). Then take the URL Picture.
Example: <img src="http://i717.photobucket.com/albums/ww176/neorie/Blogger%20Trick%20For%20You/BT4UBannerChicklet.gif"></img>

3. Set the image size and border with adding code width=”…” , height=”…” , border=”…”
Example: <img src="http://i717.photobucket.com/albums/ww176/neorie/Blogger%20Trick%20For%20You/BT4UBannerChicklet.gif" width="94" height="26" border="0"></img>

4. Log in with your Blogger Account

5. Go to Layout Tab

6. Click Edit HTML

7. Download Full Template for Back Up Data

8. Check Expand Widget Template radio button

9. Find this code:
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>


10. Put the picture code between <a expr:href='data:post.url'> and <data:post.title/></a>

Example to be like this:
<a expr:href='data:post.url'> <img src="http://i717.photobucket.com/albums/ww176/neorie/Blogger%20Trick%20For%20You/BT4UBannerChicklet.gif" width="94" height="26" border="0"></img> <data:post.title/></a>

11. Click Review to see the result. Done? Save Template


Good Luck! See you in the next post…

0 comments:

Post a Comment

Followers

Blogumulus by Roy Tanck and Amanda Fazani
Free Blogger Tips, Hacks, Widgets, Templates and more