Blogger Yazı İçine Sosyal Ağlarda Paylaş Butonu Ekleyin

Bu yazımızda blogumuzda herhangi bir yazımıza paylaş butonları ekleyeceğiz. Bu sayede ziyaretçileriniz blogunuzda okuduğu makaleleri sosyal ağlarda paylaşabilecek. Üstelik paylaştığımız eklenti çok hoş bir görünüme sahip. İsterseniz anlatıma ve kodlara geçelim. 

Aşağıdaki kodu CSS bölümüne ekliyoruz. 

#bh-paylas {
width:560px;
height:30px;
}
ul.bh-sosyal {
list-style:none;
display:inline-block;
margin:auto;
}
ul.bh-sosyal li {
display:inline;
float:left;
background-repeat:no-repeat;
margin:auto;
margin-right:4px;
}
ul.bh-sosyal li a {
display:block;
width:182px;
height:33px;
position:relative;
text-decoration:none;
}
ul.bh-sosyal li.bh-facebook {
background-image:url(http://1.bp.blogspot.com/-dQHwOYDM9VE/Ub4deG_tBzI/AAAAAAAABR8/FgxvbQ5xREg/s1600/facebook.png);
}
ul.bh-sosyal li.bh-twitter {
background-image:url(http://3.bp.blogspot.com/-MGGVJ0DGWjU/Ub4deARZVMI/AAAAAAAABSE/RRIPQvxlHXk/s1600/twitter.png);
}
ul.bh-sosyal li.bh-googleplus {
background-image:url(http://4.bp.blogspot.com/-LgrkzbtK1OM/Ub4deCj49sI/AAAAAAAABSA/Iy9DPbmqjgI/s1600/google+.png);
}

Daha sonra data:post.body kodunu temamızdan buluyoruz ve altına aşağıdaki kodu ekliyoruz. 

<b:if cond='data:blog.pageType == &quot;item&quot;'> 
<div id='bh-paylas'> 
<ul class='bh-sosyal'> 
<li class='bh-facebook'> 
<a expr:href='&quot;http://www.facebook.com/share.php?v=4&amp;src=bm&amp;u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title ' onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow'/> 
</li> 
<li class='bh-twitter'> 
<a expr:href='&quot;http://twitter.com/home?status=&quot; + data:post.title + &quot; -- &quot; + data:post.url ' rel='nofollow' target='_blank'/> 
</li> 
<li class='bh-googleplus'> 
<a expr:href='&quot;https://plusone.google.com/_/+1/confirm?hl=en&amp;url=&quot; + data:post.url' onclick='window.open(this.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' target='_blank'/> 
</li> 
</ul></div> 
</b:if>

Demo