Lompat ke konten Lompat ke sidebar Lompat ke footer

Menambahkan Floating Share Button Vertical

Menambahkan Floating Share Button Vertical
Maksud dari Floating Share Button Vertical, kalau dibahasa Indonesiakan adalah tombol berbagi yang melayang. Seperti yang sudah-sudah dibahas di tulisan-tulisan terdahulu, saat ini blog tidak bisa dipisahkan dengan sosial media lain, semisal twitter, facebook dan yang baru google+. Orang menjadi lebih suka berbagi (share) ke teman-temannya dengan menggunakan atau lewat sosial media tersebut.

Untuk itulah, blog sudah selayaknya pula untuk memasang share button atau tombol berbagi ke beberapa sosial media yang populer, seperti twitter dan facebook. Kali ini Belajar Ngeblog di BLOG akan bebagi cara menambahkan atau memasang floating share button, yang dipasang secara vertikal. Button atau tombol yang dipakai adalah like atau sukanya facebook, tweetnya twitter dan +1nya google. Di share button memakai model count, yaitu menampilkan angka sudah berapa kali dibagi (share).

Dengan memasang  Floating Share Button Vertical tentu saja membuat pembaca akan lebih muda untuk berbagi (share) tulisan yang dianggapnya menarik atau bermanfaat. Selain itu button akan selalu mengikuti, karena memang itu dibuat float atau melayang. Sehingga akan lebih menarik untuk pembaca menggunakan button itu.

Cara Menambahkan Floating Share Button Vertical
1. Login ke blogger
2. Pilih Rancangan kemudian Tambah Gadget
3. Pilih HTML/JavaScript
4. Masukan kode HTML berikut ini:

<div class="addthis_bar addthis_bar_vertical addthis_bar_large" style="top:150px;left:20px;">
<div class="addthis_toolbox addthis_default_style">
<span><a class="addthis_button_facebook_like" fb:like:layout="box_count"></a></span>
<span><a class="addthis_button_google_plusone" g:plusone:size="tall"></a></span>
<span><a class="addthis_button_tweet" tw:count="vertical"></a></span>
</div>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js"></script>

5. Simpan jika sudah selesai.

Kita dapat mengubah letak melayangnya share button tersebut, 150 itu adalah jarak dari atas dan 20 itu adalah jarak dari samping. Bersiaplah untuk blog kita lebih terintegrasi dengan dengan sosial media, dan memantau sudah berapa kali postingan (tulisan) kita dibagikan ke facebook, twitter atau diberi +1.

40 komentar untuk "Menambahkan Floating Share Button Vertical"

  1. PERTAMAXXXX!!! :D
    Info bagus! Langsung praktik!!!! :)

    BalasHapus
  2. Mas boleh tanya gak,,,saya jika mau mengedit tempalate yg hasil download...sering kesusahan edtinya...apa lagi yag pakai slideshow...gimana ganti slide shownya dengan gamabar kita..mungkin ini bisa buat topik selanjutnya di blgo ini, atau sudah dijelaskan sebelumnya yah?
    hehe salam kenal buat yg punya blog...sy pendatang baru nih, ditunggu kunjungan baliknya dan juga comment2nya tentang blog saya..

    BalasHapus
  3. pa cara buat kategori baru diblogspot tutorial nya dimana bisa di temuai ya??saya coba ajarana nya kang kolom-tutuorial.blogspot tapi susah di terapin..masih ndak ngerti..terimakasih,tolong emailkan ke dsatriapujangga@ymail.com kang...sukses buat akang

    BalasHapus
  4. thanks gann...
    kunjung baik yaa....
    :D

    BalasHapus
  5. kok di blogger saya kalo nambah gadget gak ada pilihan html/javascript ya --" , mohon bantuannya, gaptek nih :((

    BalasHapus
  6. wow dapat info baru nih, buat blogger saya, makasih yah gan

    BalasHapus
  7. Good Info....lanjutkan gan!!!

    BalasHapus
  8. Wah.. mantaf deh artikelnya, ada ilmu baru buat aku diblog ini, izin pake kodenya buat kupraktekkan, sebelumnya makasih dan salam kenal dari blogger amatir yg bermimpi jadi webmaster.

    BalasHapus
  9. kalau ga salah add this sudah punya opsi pilih widget melayang deh, jadi ga perlu hack2an

    *tapi widget melayang tak disukai sama yg buka blog lewat hp

    BalasHapus
  10. Thanks Inpo

    Mampir Ke Blog Ane Ya gan

    http://semoga-bermanfaaat.blogspot.com/

    BalasHapus
  11. makasih Info nya gan

    mampir ke blog ane juga ya gan

    http://semoga-bermanfaaat.blogspot.com

    BalasHapus
  12. langsung praktek... dan jadi... maksih banget infonya..

    BalasHapus
  13. Sudah diaplikasikan mas.. :-)

    BalasHapus
  14. Tx infonya gan...

    BalasHapus
  15. http://us.i1.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif

    BalasHapus
  16. Mantap Gan infonya..Maturnuwun
    di tunggu komentar baliknya Gan..

    BalasHapus
  17. tapi kok nggak ada share facebooknya ya bro? cuma like buttonnya aja!.

    BalasHapus
  18. kalo mo diubah jadi transparan gimana bro..soalnya background blog ane abu abu... kirim ke email aq y.. ferrichigo@gmail.com

    BalasHapus
  19. Wah mantap nih informasi moga sukses terus gan....

    BalasHapus
  20. Tutor ini kayaknya perlu diperbaiki bang, karena sumber javascriptnya perlu dipertanyakan. Saya ngetes terapkan ke blog, ehh, ada konfirmasi untuk masuk ke halaman lain. Source dengan alamat (http://s7.addthis.com/js/300/addthis_widget.js)adadalah biang keroknya mas. Saya juga telah konfirmasi ke google ternyata alamat itu mengindikasikan ke alamat http://facebook.com untuk facebook dan bukan www.facebook.com. Jadi alamat itu istilahnya menjadi alamat ke 3 dari alamat blog kita. Mohon pendapatnya, thanks juga atas info menariknya

    BalasHapus
  21. makasih tutornya masboss

    BalasHapus
  22. thanks gan suda ane pake :p

    BalasHapus
  23. waah.. lebih keren yang ini dari yang sudah pernah saya pasang. Thanks, ya...

    BalasHapus
  24. ini syaa praktekan muncul neh tombol like fb n tweter di beranda depan tpi dis etiap positingan saya gak muncul,, gm ya mas supaya buton like fb ma twetwer di stiap postingn ,,mksh sebelumnya

    BalasHapus
  25. Udah di follow nih blog nya.
    yu sama-sama di follow di blognyafiqmal.blogspot.com untuk silaturahmi dan berbagi informasi :)

    BalasHapus
  26. Agan disini memakai add this button ya, kalo gitu makin simple ni
    nice share :)

    BalasHapus
  27. Terimakasih infonya :)

    Kunjungi extraordinary28sfleur.blogspot.com
    terimakasih ya :)

    BalasHapus
  28. Ini di copy dimana bos ? bawah atau atas ?

    BalasHapus
  29. Ane liat yah gan dari semua artikel2 blog agan bagus semua dan bermanfaat makasih gan.....

    BalasHapus
  30. makasih ya bro sharingnya ;)

    www.kreasindoflooring.com

    BalasHapus
  31. thanks ya gan udah berbagi infonya.

    BalasHapus

Berlangganan via Email