Today topic about blog designing and we will learn how you can add author avatar image beside the title of every post in blogger blog.It can make your blog more attractive and professional.It show author avatar along post title but make sure you have added admin image,If you have not added go to google plus and add your image.This image is also used as blogger author.I made this hack for passionate bloggers.
Few things to know
In above image you can see sample of author avatar before post title.This trick show author image on all post even when you visit home page, it show avatar besides post title.To change the avatar you to have to change the profile image in google plus.After making changes, your blog start showing new updated image in all post of your blog.It do not matters if post title is long or short because it show avatar before post title
How to add admin image besides every post title
1 Login to blogger account
2 Go to template edit HTML press Ctrl + F and search below code
]]></b:skin>
3 Add the below code just above ]]></b:skin>
.avatar-author{float:left;margin-right:10px;border:0;border-radius:50%;padding:0;width:30px;height:30px}
4 Find this code
</head>
5 Add the below code just above </head>
<script>
//<![CDATA[
function av(a){var b=a.entry.author[0];c=b.name.$t;d=b.gd$image.src.replace(/\/s[0-9]+(-*c*)\//,'/s30$1/');document.write('<img alt="'+c+'" class="avatar-author" src="'+d+'" title="'+c+'"/>')}
//]]>
</script>
6 search
<b:if cond='data:post.title'>
Note:You may found two <b:if cond='data:post.title'>
7 Add the below code above second <b:if cond='data:post.title'>
After saving template visit your blog if it not work put below code above first <b:if cond='data:post.title'>
<script expr:src='"/feeds/posts/default/" + data:post.id + "?alt=json-in-script&amp;callback=av"'/>
your process finish.visit your blog and enjoy author image before post title.
Customization to increase size of avatar
If you want to change size of avatar then look at step 3 you can see 30px this for widget of image 30px for height., increase it according to your requirement.
save the template.If you face problem you can ask me.
