Yazı İçine Sosyal Paylaşım Butonları Ekle

Blogger Her yazının altına süper paylaşım eklentisi yukarıdaki resimde gördüğünüz hem tasarım açısından hemde kullanış açısından çok yararlı olacağını düşünüyorum çok uzatmadan linklere geçelim.

Aşağıdaki Kodu ]]></b:skin> kodunun bir satır üstüne ekleyelim.

#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);
}

Ardından data:post.body kodunu buluyoruz ve altına ekliyoruz ( birden fazla çıkabilir ama genelde 3. olur)

<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.openundefinedthis.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.openundefinedthis.href,&apos;sharer&apos;,&apos;toolbar=0,status=0,width=626,height=436&apos;); return false;' rel='nofollow' target='_blank'/> 
</li> 
<li class='bh-pinterest'> 
<a href='javascript:voidundefinedundefinedfunctionundefined)%7Bvar%20e=document.createElementundefined&apos;script&apos;);e.setAttributeundefined&apos;type&apos;,&apos;text/javascript&apos;);e.setAttributeundefined&apos;charset&apos;,&apos;UTF-8&apos;);e.setAttributeundefined&apos;src&apos;,&apos;http://assets.pinterest.com/js/pinmarklet.js?r=&apos;+Math.randomundefined)*99999999);document.body.appendChildundefinede)%7D)undefined));' rel='nofollow' target='_blank'/> 
</li> 
<li class='bh-linkedin'> 
<a expr:href='&quot;http://www.linkedin.com/shareArticle?mini=true&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;summary=&amp;source=&quot;' rel='nofollow' target='_blank'/> 
</li> 
</ul></div> 
</b:if>

DEMO

Benzer Aramalar:Blogger Paylaş butonu eklentisi,blogger yazı altına paylaşım eklentisi,blogger yayın altına paylaş butonları,her paylaşım altına sosyal paylaşım butonları,blogger her yazı altına paylaş butonları ekle

Share this: