Cara Menambah Tombol Share Sosial Media Floating atau Melayang di Blogger

Salah satu cara untuk meningkatkan lalu lintas blog Anda dengan menambah widget share media sosial di blog Anda. Dan kali ini saya akan berbagi gatget yang mungkin sudah tidak asing lagi bagi pembaca, gadget sosial share ini sangat terkenal karena mempunyai fungsi scroll bar sehingga memungkinkan lalu lintas blog Anda meningkat. 

Pada gadget ini mencakup banyak media sosial di dalamnya seperti facebook, twitter dan Google Plus dan pinterest juga. Nah, sekarang mari kita praktek bagaimana cara menambah Tombol Share Floating Bar Media Sosial di halaman posting Anda.

Artikel terkait : Cara Membuat Tombol Share di Bawah Posting


Menambah Floating Bar Media Sharing :

Di bawah ini adalah beberapa langkah mudah yang perlu Anda lakukan.

• Login - Masuk ke Halaman Dashboard Blogger Anda
• Klik Template
• Setelah halaman editor Blogger terbuka, tekan Ctrl+F untuk mencari kode berikut :

<b:includable id='post' var='post'>

• Selanjutnya copy paste kode di bawah tepat setelah kode di atas.

<b:if cond='data:blog.pageType ==  &quot;item&quot;'>
<b:if cond='data:blog.pageType !=  &quot;static_page&quot;'>
<style>
.mbt_social_floating{
position:fixed; bottom:10%; margin-left:-60px; float:left;  width:60px;
background-color:#f7f7f7; padding: 5px 0 0px 0px;
border-top:1px solid #ddd;
border-left:1px solid #ddd;
border-bottom:1px solid #ddd;
z-index:9999px !important;
border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;
}
.mbt_social_floating .mbt_side_social_button{
margin-bottom:5px;
float:none;
height:auto;
width:60px;
}
.mbt_social_floating .st_twitter_vcount,  .mbt_social_floating.st_plusone_vcount, .st_email{
margin-left:5px;
}
.mbt_social_floating .st_fblike_vcount{
margin-left:5px;
}
.mbt_social_floating .stButton_gradient{
background:none !important;
height:21px !important;
padding-left:0 !important;
}
.mbt_social_floating .chicklets, .mbt_social_floating  .stMainServices {
background:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRcXFnHZMhALMGN0jJszzc-8UoJlR23Ayp9OagVmpEzxXxzYEig2goL1YwLFZnpS53oJuxmlGgVZuZxGEwUhpHBDO_KDssMhB9oZo6KtNiKAcCGFLZbfTpHI3apWa7FY17Y0wwc8fKdbk3/s400/gc_social_sprite.gif&#39;)   no-repeat !important;
height:19px !important;
width:45px !important;
padding:0 !important;
}
.st_email .chicklets{
background-position:0 -77px !important;
background-image:url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRcXFnHZMhALMGN0jJszzc-8UoJlR23Ayp9OagVmpEzxXxzYEig2goL1YwLFZnpS53oJuxmlGgVZuZxGEwUhpHBDO_KDssMhB9oZo6KtNiKAcCGFLZbfTpHI3apWa7FY17Y0wwc8fKdbk3/s400/gc_social_sprite.gif&#39;)   !important;
}
.mbt_social_floating .st_twitter_vcount .st-twitter-counter{
background-position:0 -58px !important;
}
.mbt_social_floating .stButton_gradient{
border:none !important;
}
.mbt_social_floating .stBubble_count{
width:44px !important;
font-size: 15px !important;
font-weight: normal !important;
padding-top:7px !important;
height:23px !important;
background:none !important;
}
.mbt_social_floating .st_twitter_vcount .stBubble_count{
color:#00a6df;
background-color:#f8fbfc !important;
}
.st_fblike_vcount{
margin-bottom: 0px;
display: block;
}
.st_twitter_vcount{
margin-bottom: 3px;
display: block;
}
.st_email{
margin-bottom: 5px; margin-top: 3px;
display: block;
}
.mbt_social_floating .stBubble{
background-position: 21px 31px !important;
height:35px !important;
}.mbt_social_floating .st_pinterest_vcount{
margin-left:5px;
}
.mbt_social_floating .st_pinterest_vcount  .st-pinterest-counter{
background-position:0 -19px !important;
}
.mbt_social_floating .st_pinterest_vcount .stBubble_count{
color:#FF0505;
background-color:#fbf8f8 !important;
}
.mbt_social_floating .st_pinterest_vcount .stBubble{
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWnCvqvB6upOlrfde2oOWq41JZ1M0KFPkVilMDL8mMkTA3duVeiXGiYFhh7Skf-plIJrtZd_D9oedSk_rPUWJh1nncVkklDhY5dRbftCpakgUUfSHnFEN06sjgc704ofP7R_TNmd5edsGL/s400/bubble_arrow_pinterest.png')   !important;
}
.st_pinterest_vcount{
margin-bottom: 0px;
display: block;
}
</style>
<div class='mbt_social_floating'>
<script type='text/javascript'>var  switchTo5x=true;</script>
<script src='http://w.sharethis.com/button/buttons.js'  type='text/javascript'/>
<script  type='text/javascript'>stLight.options({onhover:false, , doNotHash: true,  doNotCopy: true, hashAddressBar: false});</script>
<!-- No more works properly so removing it from mbt  list<span class='st_fblike_vcount' displaytext=''/>-->
<div style='margin:0px 0 0px 10px;'><div  id='fb-root'/><script  src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font=''  href='' layout='box_count' send='false' show_faces='false'/></div>
<span class='st_twitter_vcount' displaytext=''  st_via='satudelapan'/>
<span class='st_pinterest_vcount' displaytext=''/>
<div style='margin:0px 0 0 5px;'>
<span class='st_plusone_vcount' displaytext=''/>
</div>
<div class='addthis_toolbox addthis_default_style '  style='margin:5px 0px 5px 8px;'>
<a class='addthis_counter'/>
</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js'  type='text/javascript'/>
<script type='text/javascript'>
var addthis_config = {
ui_cobrand: &quot;Satu Delapan&quot;,
ui_header_color: &quot;#ffffff&quot;,
ui_header_background: &quot;#0080FF&quot;
}
</script>
<span class='st_email' displaytext=''/>
<p style=' line-height:0px; font-size:10px; font-weight:bold;  text-align:center;'><a href='http://www.blogsatudelapan.com/2013/05/cara-menambah-tombol-share-sosial-media.html'  style='color:#CAC8C8;'>Widgets</a></p>
</div>
</b:if></b:if> 

• Langkah terakhir Simpan Template - Selesai

Tambahan :

Ganti nama satudelapan dengan akun twitter Anda.

Dengan menyelesaikan langkah di atas secara otomatis gadget akan tampil di sisi kiri posting dalam posisi mengapung. Untuk melakukan perubahan warna atau posisi dari gadget bisa Anda lakukan sendiri dengan mengubah kode widget diatas

Tutorial di atas adalah cara menambah Tombol Share Sosial dengan gaya Floating di blogger Anda. Bila ada yang ingin ditanyakan silahkan tinggalkan komentar karena komentar Anda merupakan bahan pelajaran buat penulis. Akhir kata semoga artikel yang saya bawa kali bermanfaat untuk Anda dan Happy blogging. Salam satu-delapan !