Show Image Next to Post Titles in Blogger Tips and Tricks

 

Adding an author profile picture or blog's logo next to your blog posts title can improve your blog's look that gives a professional touch to your blog posts. It really help to build your blog readership as it is must to gain reader's trust. When they land to your blog to read the posts, they should feel that there is someone who is willing to build up this blog. No one will like a dead blog. If you will add an author profile image before your blog posts title then they will attract to you and try to communicate with you for any of their queries or feedback. So let's see how to add an image or avatar just before every post titles in blogger.

Adding Image Before Post Titles

Perform these simple steps:

1. Go to Blogger.
2. Navigate to Template >> Edit HTML
3. Backup your blog template. (Read this: How to backup template in blogger?)
4. Now press Ctrl+F and search for .post h3 or .post h2
5. You will find a similar code like this




.post h3 {
color: #7CA2C4;
font-size: 20px;
font-family: Arial, sans-serif;;
font-weight: normal;
margin: 0px;
padding: 0px 10px 0 47px;
}




6. Now replace the whole code with this one


.post h3 {
background:url(Image URL) no-repeat top left;
color: #289728;
font-size: 20px;
font-family: Arial, sans-serif;;
font-weight: normal; height:45px;
margin: 0px;
padding: 0px 10px 0 47px;
line-height:1.1em;
}


7. Now replace Image URL with your image or icon URL.
8. Now click on save template button.
9. You are done!

Advice:
Use image under the size of 40px x 40px. It will better if you use an image with white background because it looks nifty.