Burada paylaşacağım eklentide Twitter, Facebook ve Google’a ait paylaşım düğmelerini CSS srprite özelliğinden faydalanarak ayrı ayrı kutulara koyarak blog yazılarımızın sonuna yerleştireceğiz.Oldukça şık ve dikkat çekici olduğunu düşündüğüm bu sosyal paylaşım kutularını yazılarınızın sosyal medyada paylaşım sayısını arttıracaktır.
Eklentiyi blogunuza eklemek için şablonunuzdan <div class='post-footer'> kodunu bulun ve hemen altına aşağıdaki kodları ekleyin.
<b:if cond='data:blog.pageType == "item"'>
<style>
.promote_post_bg {
height: 103px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhIFxPnGks-fHbyBf5FbeNkghYnU77B471XE8b2r2xkDrj1bIFcrCfYw-xMP44JLO_XlnD1iLDaeUfiPpUsejFDJnBUFEMYki25I9dUau67QTME4KiMzn36xngQqFVb-qBdWLGywdGSNs/s516/paylas.png) 0 -7px no-repeat;
width: 500px;
margin-left: 65px;}
.promote_twitter {
width: 130px;
height: 38px;
float: left;
margin: 0 39px 0 0;
padding: 65px 0 0 13px;
text-align: center;}
.promote_facebook {
width: 115px;
height: 40px;
float: left;
margin: 0 39px 0 0;
padding: 63px 0 0 28px;
text-align: center;}
.promote_google {
width: 65px;
height: 40px;
float: left;
margin: 0 39px 0 0;
padding: 65px 0 0 28px;
text-align: center;
}
</style>
</b:if>
<div class='promote_post_bg'>
<div class='promote_twitter'>
<a class='twitter-share-button' data-via='helperblogger' href='https://twitter.com/share'>Tweet</a>
<script>
!
function (d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (!d.getElementById(id)) {
js = d.createElement(s);
js.id = id;
js.src = "//platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
}
}(document, "script", "twitter-wjs");
</script></div>
<div class='promote_facebook'>
<fb:like action='like' colorscheme='light' expr:href='data:post.canonicalUrl' font='verdana' layout='button_count' send='false' show_faces='false'/>
<div>
<b:if cond='data:post.isFirstPost'>
<script>
(function (d) {
var js, id = 'facebook-jssdk';
if (d.getElementById(id)) {
return;
}
js = d.createElement('script');
js.id = id;
js.async = true;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
d.getElementsByTagName('head')[0].appendChild(js);
}(document));
</script>
</b:if></div>
</div>
<div class='promote_google'>
<g:plusone annotation='none' size='medium'/>
<script type='text/javascript'>
(function () {
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script></div>
</div>
Alternatif sosyal paylaşım butonları için şu yazılarıma göz atabilirsiniz:
){kind=link}