Lewati ke konten

Facebook Slide Out Share Button Blogger

Sobat blogger tentu sudah tahu Facebook kan? Media sosial paling populer saat ini. Oleh karena itu Facebook menjadi salah satu media paling menarik untuk memasarkan blog sobat. Facebook juga menjadi alat untuk mencari dukungan. Misalnya dengan memasang plugin "Like", "Share", dll. Kali ini kita akan belajar memasang tombol berbagi (share button) Facebook untuk blogger. Share button ini dalam bentuk slide out, yaitu muncul sedikit saja dan bila disentuh barulah keluar semuanya.
Tertarik memasang Facebook Slide Out Share button untuk Blogger blogs?

Tambahkan widget HTML/JavaScript lalu copy-paste code berikut ini.


<b:if cond='data:blog.pageType == "item"'>
    <style>
#fixed-share {background: none repeat scroll 0 0 #4C6699;bottom: 60px;font-family: Arial;font-size: 16px;padding: 15px 30px 15px 15px;position: fixed;right: -147px;text-align: left;text-transform: uppercase;transition: all 1s ease 0s;z-index: 10;}
#fixed-share:hover {right: 0}
#fixed-share:hover > #share-box {right: 147px}
#share-box {background: none repeat scroll 0 0 #4C6699;bottom: 72px;height: 40px;position: fixed;right: 1px;text-align: center;transition: all 1s ease 0s;width: 40px;}
    </style>
<div id="fixed-share">
<div id="share-box">
<img src="http://icons.iconarchive.com/icons/yootheme/social-bookmark/256/social-facebook-button-blue-icon.png"/>
</div>
<span>Support Us<br/><script>(function(d){ var js, id =
    'facebook-jssdk'; if (d.getElementById(id)) {return;} js =
    d.createElement('script'); js.id = id; js.async = true; js.src =
    "//connect.facebook.net/en_US/all.js#xfbml=1";
    d.getElementsByTagName('head')[0].appendChild(js);
    }(document));</script>  <fb:share-button expr:href='data:post.url'
    type='button_count'/> </fb:share-button>
</span></div>
</b:if>

Selamat belajar :)

0 komentar

Tulis komentar

Memuat komentar…

Tentang

Halo! Saya asisten Jelas in Blog.

Mode warna

Komentar terbaru

  • Memuat…
↑ ↓ pilih   Enter buka   Esc tutupCari di web

Kirim pesan

Pesan dikirim ke email pemilik blog.

Konversi kode

Tempel kode di bawah. Hasilnya aman ditulis di komentar dan langsung disalin, tinggal tempel di kolom komentar.

Halo dan Selamat datang di Jelasinblog, situs yang memuat informasi dan tutorial Blogger dan WordPress gratis untuk pemula. Tujuan utama kami adalah untuk menyediakan tutorial Blogger dan WordPress mutakhir yang mudah dipahami untuk blogger, dan pemilik situs WordPress.

Daftar Tautan