Add Round Author Avatar Before Post Title In Blogger

Today topic virtually weblog designing together with nosotros volition larn how you lot tin add together writer avatar ikon beside the championship of every post service inwards blogger blog.It tin brand your weblog to a greater extent than attractive together with professional.It present writer avatar along post service championship but brand certain you lot convey added admin image,If you lot convey non added acquire to google addition together with add together your image.This ikon is also used equally blogger author.I made this hack for passionate bloggers.

Few things to know

In inwards a higher house ikon you lot tin run into sample of writer avatar earlier post service title.This fob present writer ikon on all post service fifty-fifty when you lot view abode page, it present avatar too post service title.To alter the avatar you lot to convey to alter the profile ikon inwards google plus.After making changes, your weblog start showing novel updated ikon inwards all post service of your blog.It create non matters if post service championship is long or brusk because it present avatar earlier post service title

How to add together admin ikon too every post service title

1 Login to blogger account

2 Go to template edit HTML press Ctrl + F together with search below code

]]></b:skin>

3 Add the below  code simply inwards a higher house ]]></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 simply inwards a higher house </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 constitute  two <b:if cond='data:post.title'>

7 Add the below code inwards a higher house second <b:if cond='data:post.title'>

After saving template view your weblog if it non piece of work pose below code inwards a higher house first <b:if cond='data:post.title'>

<script expr:src='&quot;/feeds/posts/default/&quot; + data:post.id + &quot;?alt=json-in-script&amp;amp;callback=av&quot;'/>

your procedure finish.visit your weblog together with relish writer ikon earlier post service title.

Customization to increase size of avatar

If you lot desire to alter size of avatar together with thence await at stride three you lot tin run into 30px this for widget of ikon 30px for height., increase it according to your requirement.

save the template.If you lot confront work you lot tin inquire me.

Bagikan Artikel ini