• Breaking News

    Blog Pendidikan, Contoh Makalah, Contoh Naskah Drama, English Text, Contoh Resensi, Contoh Surat

    Cara Membuat Tombol Share Melayang Di Blog Efek Keren

    Krumpuls - Cara Membuat Tombol Share Melayang Di Blog Efek Keren - Sosial Share, Sosial media memang sangatlah penting bagi blog kita, selain berfungsi untuk mempromosikan artikel berita kita ke berbagi sosial media juga berfungsi penyebar artikel yang efisien, dengan adanya sosial media seperti facebook, twitter, google plus memungkin pembaca membagikan konten yang anda tulis pada orang lain.


    Cara memasang sosial share melayang di blog

    Berikut cara memasang sosial share ke blog kita. Masuk ke blogger kamu. Klik Rancangan >> Tambah gadget dan pilih HTML/Javascript. Lalu copy dan paste kode dibawah ini.Script yang pertama cukup keren contohnya bisa sobat lihat yang ada pada sisi kiri blog ini, berikut script serta tampilanya.

    1. Ini variasi pertama yang sangat simple bisa anda terapkan

    <!-- Floating social media buttons by www.krumpuls.net --><style> #floatingbuttons{background:#41A317;background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #A1D423), color-stop(1, #80A81C));background:-moz-linear-gradient(top, #41A317, #41A317);border:1px solid #739619;float:left;padding:0 0 3px 0;position:fixed;bottom:15%;left:0;z-index:10;border-radius:0 5px 5px 0;box-shadow:2px 2px 5px rgba(0,0,0,0.3);} #floatingbuttons .floatbutton{float:left;clear:both;margin:5px 4px 0 4px;} .addbuttons{clear:both;text-align:center;padding-top:5px;} .addbuttons a span.getfloat, .addbuttons a span.sharebuttons{color:#fff;background:none;font-family:arial, sans-serif;display:block;font-size:9px;font-weight:bold;text-decoration:none;line-height:11px;} .addbuttons a:hover span{color:#fff;background:none;text-decoration:underline;}</style> <div id='floatingbuttons' title="Share this post!"> <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><script type="text/javascript"> (function() { var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0]; s.type = 'text/javascript'; s.async = true; s.src = 'http://widgets.digg.com/buttons.js'; s1.parentNode.insertBefore(s, s1); })(); </script><!-- Medium Button --><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script><div class='floatbutton' id='facebook'> <fb:like layout="box_count" show_faces="false" font=""></fb:like></div> <div class='floatbutton' id='google+1'> <g:plusone size="tall"></g:plusone></div> <div class='floatbutton' id='twitter'> <a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a></div> <!-- end Floating social media buttons by www.krumpuls.net --></div>


    2. Model variasi tombol share kedua, merupakan share yang lengkap


    <!--SideBar Floating Share Buttons Code Start--> <style> #pageshare {position:fixed; bottom:15%; left:10px; float:left; border: 1px solid black; 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="Share This With Your Friends"> <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: 12px;text-align:center;"><a href="http://www.krumpuls.net/2014/11/cara-membuat-tombol-share-melayang-di.html" target="blank"><font color="black">[Get This]<font></font></font></a></div></div>


    Demikianlah artikel yang bisa saya share mengenai Cara Membuat Tombol Share Melayang Di Blog Efek Keren semoga bermanfaat dan berguna untuk anda semua.

    Fashion

    Beauty

    Travel