membuat widget social share melayang responsif
membuat widget share sosial media melayang di samping blog agar artikel kita dapat dibagikan oleh para pembaca , mungkin sudah banyak yang memanfaatkannya agar pengunjung dapat membagikan artikel ke sosial media , karena pengguna sosial media sangat melimpah . ini bisa menjadi tombol panen trafik , karena jika ada orang yang menyukai artikel anda dan dia menyebarkan nya dengan cara yang sangat mudah dengan menekan tombol share saja, ke teman teman nya . otomatis temannya akan muncul rasa ingin tahu dan membukanya
Langsung saja kita akan melanjutkan tutorialnya
WIDGET PERTAMA
widget pertama responsif
WIDGET KEDUA
widget kedua seperti gambar dibawah ini
KANAN
WIDGET KETIGA
widget ketiga penampilan nya lebih bagus
Jika sudah memilih widget mana yang diinginkan , Copy kode tersebut
dan simpan di
Dan , Tambahkan widget ke salah satu tempat di tata letak -> pilih Html/javascript , -> simpan ..
Jika anda kesulitan , tinggalkan komentar
semoga bermanfaat bagi anda yang berkunjung , dan ikuti terus update blog ini . dan baca juga tentang membuat sitelink dengan mudah
BACA : CARA MENGHILANGKAN TANGGAL PADA ARTIKELCaranya cukup simpel dengan cara menambahkan widget saja , ini mungkin memang hal sederhana tapi dengan widget ini orang orang dapat dengan mudah membagikan kiriman anda yang ia ke berbagai media sosial tanpa repot ,
Langsung saja kita akan melanjutkan tutorialnya
WIDGET PERTAMA
widget pertama responsif
<!--Widget Share like FB tweet google plus digg Button Melayang Start--><style>#pageshare {position:fixed; bottom:15%; right:10px; float:left; border: 1px solidblack; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;padding:0 0 2px 0;z-index:10;} #pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;} .fb_share_count_top {width:48px !important;} .fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;} .FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;} .FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;} </style><div id='pageshare' title="bagikan ke teman anda">
<div class='sbutton' id='gb'>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div>
<div class='sbutton' id='rt'>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></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 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='fb'>
<a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div>
<br/><div style="clear: both;font-size: 8px;text-align:center;">
<a href="http://kumiseoblogspot.co.id/2016/06/membuat-widget-social-melayang.html" target="blank"><font color="blue">Get Widget Here<font></font></font></a></div>
</div>
<!--Widget Share like FB tweet google plus digg Button Melayang End-->
WIDGET KEDUA
widget kedua seperti gambar dibawah ini
KANAN
<!--widget by http://kumiseo.blogspot.com-->
<script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript" src="http://s.sharethis.com/loader.js"></script>
<script type="text/javascript">stLight.options({publisher: "1f446043-8507-4fbd-b382-cd21d7c439c0", doNotHash: false, doNotCopy: false, hashAddressBar: false});</script>
<script>var options={ "publisher": "1f446043-8507-4fbd-b382-cd21d7c439c0", "position": "left", "ad": { "visible": false, "openDelay": 5, "closeDelay": 0}, "chicklets": { "items": ["facebook", "twitter", "linkedin", "pinterest", "email", "sharethis"]}};var st_hover_widget = new sharethis.widgets.hoverbuttons(options);</script>
<!--widget end http://kumiseo.blogspot.com-->
KIRI<!--widget end http://kumiseo.blogspot.com-->
<!--widget by http://kumiseo.blogspot.com-->
<script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script>
<script type="text/javascript" src="http://s.sharethis.com/loader.js"></script>
<script type="text/javascript">stLight.options({publisher: "1f446043-8507-4fbd-b382-cd21d7c439c0", doNotHash: false, doNotCopy: false, hashAddressBar: false});</script>
<script>var options={ "publisher": "1f446043-8507-4fbd-b382-cd21d7c439c0", "position": "left", "ad": { "visible": false, "openDelay": 5, "closeDelay": 0}, "chicklets": { "items": ["facebook", "twitter", "linkedin", "pinterest", "email", "sharethis"]}};var st_hover_widget = new sharethis.widgets.hoverbuttons(options);</script>
<!--widget end http://kumiseo.blogspot.com-->
<!--widget end http://kumiseo.blogspot.com-->
WIDGET KETIGA
widget ketiga penampilan nya lebih bagus
<!-- Start Shareaholic Sassy Bookmarks HTML--> <div class='shr_ss shr_publisher'> </div> <!-- End Shareaholic Sassy Bookmarks HTML --> <!-- Start Shareaholic Sassy Bookmarks settings --> <script type='text/javascript'> var SHRSS_Settings = {"shr_ss":{"src":"//dtym7iokkjlif.cloudfront.net/media/downloads/sassybookmark","link":"","service":"5,7,2,313,38,201,88,74","apikey":"b87f5899d80a5edce8b5e55f58542ef0f","localize":true,"shortener":"bitly","shortener_key":"","designer_toolTips":true,"tip_bg_color":"black","tip_text_color":"white","viewport":true,"twitter_template":"${title} - ${short_link} via @Shareaholic"}}; </script> <!-- End Shareaholic Sassy Bookmarks settings --> <!-- Start Shareaholic Sassy Bookmarks script --> <script type='text/javascript'> (function() { var sb = document.createElement("script"); sb.type = "text/javascript";sb.async = true; sb.src = ("https:" == document.location.protocol ? "https://dtym7iokkjlif.cloudfront.net" : "http://cdn.shareaholic.com") + "/media/js/jquery.shareaholic-publishers-ss.min.js"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(sb, s); })(); </script> <!-- End Shareaholic Sassy Bookmarks script -->
Jika sudah memilih widget mana yang diinginkan , Copy kode tersebut
dan simpan di
Dan , Tambahkan widget ke salah satu tempat di tata letak -> pilih Html/javascript , -> simpan ..
Jika anda kesulitan , tinggalkan komentar
semoga bermanfaat bagi anda yang berkunjung , dan ikuti terus update blog ini . dan baca juga tentang membuat sitelink dengan mudah
izin coba gan
BalasHapuswah boleh nih biar blog ane makin keche
BalasHapus