Widget ini dulu pernah saya pasang di blog Oto Website dan kali ini saya akan membagikannya kepada Anda. Widget ini tidak akan menghabiskan tempat pada blog/situs anda.
Jadi bagi Anda yang kehabisan tempat pada blog/situs Anda, Anda saya sarankan untuk menggunakan Vertical Floating Social Sharing Bar Part-1.
Dan bagi anda yang suka dengan widget melayang bisa menggunakan widget ini. cara memasang widget ini juga mudah alias tidak ribet dan tidak pake lama.
Disini saya melakukan sedikit perubahan pada widget ini agar bisa menjadi lebih menarik, pada gambar di bawah ini bisa anda lihat perubaha yang telah saya lakukan pada widget ini.
Sebelum di rubah (default)
Setelah saya rubah (sekarang)
Saya hanya sedikit merubahnya agar widget ini menjadi lebih menarik saja.
Cara penempatan Vertical Floating Social Sharing Bar Part-1 ini ada dua macam di antaranya di bagian
- Left (Kiri) blog/situs Anda.
- Right (Kanan) blog/situs Anda.
Cara Memasang Vertical Floating Social Sharing Bar Part-1
Pertama-tama Anda harus menginstal Java Script Vertical Floating Social Sharing Bar Part-1 di template blog/situs Anda.
Caranya:
1. Login ke akun blogger.
2. Pada Dasbor klick Rancangan ➨ Edit HTML.
3. Centang Expand Template Widget ➨ Backup dulu templatenya untuk mengantisipasi bila terjadi kesalahan.
4. Selanjutnya dalam Edit Template Anda cari kode </head> Jika kesulitan mencarinya coba baca Cara Cepat Mencari Kode HTML.
5. Bila sudah ketemu sekarang letakkan kode java script berikut di atas kode tadi.
<script type="text/javascript">var switchTo5x=true;</script>
<script type="text/javascript" src="https://otowebsite-blogspot.googlecode.com/svn/trunk/share_buttons.js"></script>
<script type="text/javascript" src="https://otowebsite-blogspot.googlecode.com/svn/trunk/share_loader.js"></script>
6. Jangan di Simpan dulu lakukan langkah selanjutnya.
Meletakkan posisi dari Vertical Floating Social Sharing Bar Part-1
Di ini Anda harus memilih salah satu tempat di mana Anda ingin widget Vertical Floating Social Sharing Bar Part-1 ini muncul.
Caranya:
8. Dalam Edit Template cari kode </body> dan letakkan salah satu kode berikut di atasnya.
Vertical Floating Social Sharing Bar Part-1 Left Posisiont
<script>
var options={ "publisher": "d4be5209-8eb5-4854-8391-917faf746b47", "position": "left", "ad": { "visible": false, "openDelay": 5, "closeDelay": 0}, "chicklets": { "items": ["facebook", "twitter", "googleplus", "linkedin", "pinterest", "sharethis"]}};
var st_hover_widget = new sharethis.widgets.hoverbuttons(options);
</script>
Vertical Floating Social Sharing Bar Part-1 Right Posisiont
<script>
var options={ "publisher": "d4be5209-8eb5-4854-8391-917faf746b47", "position": "right", "ad": { "visible": false, "openDelay": 5, "closeDelay": 0}, "chicklets": { "items": ["facebook", "twitter", "googleplus", "linkedin", "pinterest", "sharethis"]}};
var st_hover_widget = new sharethis.widgets.hoverbuttons(options);
</script>
9. Terakhir Simpan template.
Warning:
Dari kode di atas jangan ada yang Anda rubah, karna kode tersebut menggunakan Id atau sudah terbungkus tag kondisional agar widget berfungsi dengan baik, dan bila di rubah scrip tersebut tidak akan berfungsi.
Sekian!
Oke saya rasa cukup untuk postingan atau articles Vertical Floating Social Sharing Bar Part-1. Silahkan anda tunggu lanjutan dari Vertical Floating Social Sharing Bar Part-1 ya itu:
Vertical Floating Social Sharing Bar Part-2 yang lebih menarik lagi!
Bagaimana apakah Anda berhasil menerapkannya pada blog/situs Anda? silahkan tinggalkan tanggapan atau komentar Anda tentang postingan atau articles di atas!
ka rif...gmn kbrnya,,, ka rif saya mau tanya gmn caranya bikin postingan ada lampunya
BalasHapus@rama banten Rb Sya mengnkan Java Script + HTML yg trbugkus tag kondisional untuk membuatnya.
BalasHapusjika anda berminat cepat/lmbat sya akan sgera membhasnya.