Social share widget sendiri merupaka Widget Blog yang digunakan untuk berbagi Artikel maupun Postingan yang berada didalam Blog, yang akan saya bagikan kali ini adalah widget social share widget melayang.
Widget ini terdiri dari ; Like button facebook, digg button, dan google plus.
Penampakkannya seperti gambar dibawah ini ;
Atau juga bisa langsung lihat diSamping kiri Blog ini.
Cara memasangnya cukup mudah, sama seperti memasang widget Blog pada umumnya, yaitu ;
- Didalam Panel Admin, pilih Tata Letak
- Add Gadget (dimana saja)
- Pilih Html/Javascript
- Lalu Masukkan Kode dibawah ini :
<!– floating share Widget by erdinmaulana.blogspot.com–>
<style type=”text/css”>
#pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;/*bs-fsmsb*/margin:5px 5px 0 5px;}
</style>
<div id=’pageshare’ title=”Get this Widget from erdinmaulana.blogspot.com”>
<div class=’sbutton’ id=’like’ style=’margin-left:8px;’>
<div id=”fb-root”></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = “//connect.facebook.net/en_US/all.js#xfbml=1”;
fjs.parentNode.insertBefore(js, fjs);
}(document, ‘script’, ‘facebook-jssdk’));</script>
<div class=”fb-like” data-send=”false” data-layout=”box_count” data-width=”40″ data-show-faces=”false”></div>
</div>
<div class=’sbutton’ id=’rt’>
<script src=”http://tweetmeme.com/i/scripts/button.js” type=’text/javascript’></script>
</div>
<div class=’sbutton’ id=’su’>
<script src=”http://www.stumbleupon.com/hostedbadge.php?s=5″></script>
</div>
<div class=’sbutton’ id=’digg’ style=’margin-left:3px;width:48px’>
<script src=’http://widgets.digg.com/buttons.js’ type=’text/javascript’></script>
<a class=”DiggThisButton DiggMedium”></a>
</div>
<div class=’sbutton’ id=’gplusone’>
<script type=”text/javascript” src=”https://apis.google.com/js/plusone.js”></script>
<g:plusone size=”tall”></g:plusone>
</div>
<div style=”clear: both;font-size: 9px;text-align:center;”>Get <a href=”http://www.erdinmaulana.blogspot.com/”>widget</a></div><!– Do not remove this link –>
</div>
<!– floating share bar End –>
- Save dan Lihat hasilnya.
