Widget ini mengandung tombol Facebook like , tombol Tweet, Pin it, G+1, tombol email. Widget ini sudah dites di internet explorer, mozilla, google chrome. Widget sharing bar ini berada disisi kiri bagian post dan akan tetap berada diposisi itu walaupun pengunjung meng-scroll blog. Sebelum melanjutkan ke topik pembahasan, ada baiknya anda juga membaca postingan berikut ini:- Cara membuat pop up share to enter
- Membuat Flipper Sharing Widget dibawah postingan
Widget ini berisi counter yang penting untuk situs jejaring sosial yang memiliki potensi untuk meningkatkan traffik dan menyebarkan posting anda ke orang-orang secara lebih luas. Widget ini telah terintegrasi baik AddThis dan layanan ShareThis di dalamnya. Widget ini hanya akan ditampilkan pada halaman posting saja dan tidak akan ditampilkan pada homepage. Widget ini memiliki latar belakang putih dan mengapung ke sisi kiri posting blog Anda. Jika anda tertarik, ikutilah step-step dibawah ini:
- Masuk ke Blogger >> Template >> Edit Html
- Centang "Expand Widget Templates"
- Cari kode dibawah ini:
<b:includable id='post' var='post'>
- Paste kode ini dibawah kode <b:includable id='post' var='post'>
<b:if cond='data:blog.pageType == "item"'><b:if cond='data:blog.pageType != "static_page"'><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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbbsCNKTZowTdrj8k5GrJz5j63fOtx1Da0UigV8BJ32RR0HWihtEHxZc6dLenfyrzP_6UTzNDfElXboqM8zdQFGEm0IVCMPZreJtdTX_R8pIEWD_aXDIuGgFkckL0R5Y2XPI80FPLdGDzB/s400/gc_social_sprite.gif') no-repeat !important; height:19px !important; width:45px !important; padding:0 !important;}.st_email .chicklets{background-position:0 -77px !important; background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbbsCNKTZowTdrj8k5GrJz5j63fOtx1Da0UigV8BJ32RR0HWihtEHxZc6dLenfyrzP_6UTzNDfElXboqM8zdQFGEm0IVCMPZreJtdTX_R8pIEWD_aXDIuGgFkckL0R5Y2XPI80FPLdGDzB/s400/gc_social_sprite.gif') !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;}</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});</script><span class='st_fblike_vcount' displaytext=''/><span class='st_twitter_vcount' displaytext='' st_via='yo2manth'/><div style='margin:5px 0 0px 0;'><center><a class='pin-it-button' count-layout='vertical' expr:href='"http://pinterest.com/pin/create/button/?url=" + data:post.url'>Pin It</a><a href='javascript:void(run_pinmarklet())' style='margin-left:-46px; width:43px; height:20px; display:inline-block;'/><script src='http://assets.pinterest.com/js/pinit.js' type='text/javascript'/><script type='text/javascript'>function run_pinmarklet() {var e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r=' + Math.random()*99999999);document.body.appendChild(e);}</script></center></div><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: "Yoyo Suharyo",ui_header_color: "#ffffff", ui_header_background: "#0080FF"}</script></div></b:if></b:if>
Keterangan:
# Ganti "yo2manth" dengan username twitter kamu.
# Kode berwarna biru adalah kode posisi widget.
# Tulisan berwarna hijau adalah warna background widget
# Tulisan berwarna Merah, ganti dengan title blog anda
- Save Template !
Last Words
Bagaimana? sangat mudah sekali bukan? Jadi kesimpulannya, semoga widget ini akan membantu Anda untuk meningkatkan pengikut sosial Anda dan widget ini dibuat oleh mybloggerlab.com. Jika Anda memiliki pertanyaan maka beritahu saya di komentar. Sekian post tentang Cara Membuat Floating Bar dengan Sharing Buttons di blog. Jangan lupa membaca post saya yang lainnya dengan membaca DAFTAR ISI. Maaf bila ada salah-salah kata, semoga tulisan ini dapat bermanfaat bagi anda. Tetap terhubung dengan Ujangyoyo karena akan ada postingan baru yang lebih menarik. Happy Blogging friends!
AD-BLOCKER DETECTED!
