Sunday, November 3, 2013

Cara Membuat Tombol Share Melayang di Blog

Untuk meningkatkan traffic blog kita, selain upaya optimasi SEO kita juga perlu membuat tombol share di blog kita yang akan menghubungkan blog dengan media jejaaring sosial seperti facebook, twitter ataupun google+. Tutorial kali ini saya akan membahas cara membuat tombol share melayang di sisi kiri atau kanan blog anda.


tombol share di blog

Berikut langkah-langkah pemasangannya di blog :

1. Masuk ke akun > Pilih Tata Letak
2. Klik Tambah Gadget di bagian sidebar
3. Pilih HTML/Javascript kemudian copy paste kode di bawah ini

<!--Widget Share like FB tweet google plus digg Button Melayang Start-->
<style>
#pageshare {position:fixed; bottom:15%; left:10px; float:left; border: 1px solidblack; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#eff3fa;padding:0 0 2px
0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style><div id='pageshare' title="bagikan ke teman anda"><div class='sbutton' id='gb'><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="box_count" show_faces="false" font=""></fb:like></div><div class='sbutton' id='rt'><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a><script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script></div><div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div><div class='sbutton' id='su'><script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script></div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'><script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script><a class="DiggThisButton DiggMedium"></a></div>
<div class='sbutton' id='fb'><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div><br/><div style="clear: both;font-size: 8px;text-align:center;"><a href=" http://inticoretan.blogspot.com/2013/11/cara-membuat-tombol-share-melayang-di-blog.html"  target="blank"><font color="blue">Get Widget Here<font></font></font></a></div></div>
<!--Widget Share like FB tweet google plus digg  Button Melayang End-->

4. Simpan  widget dan lihat blog anda

Note : Tulisan berwarna merah adalah posisi widget, saya memakai widget ini disebelah kiri jadi saya tulis left, kalau anda ingin mengubahnya di sebelah kanan tinggal ganti tulisan berwarna merah dengan right.

Selesai...mudah kan ??
oh iya jika anda sudah memiliki tombol google+ ( G+ ) baik di atas maupun dibawah postin, kemungkinan tombol google+ di widget yang kita buat tadi tidak akan muncul.

Demikianlah tutorial cara menampilkan tombol share melayang di blog. Semoga bermanfaat

36 comments:

  1. sip gan
    mmpir di hums sya gan http://www.emelde.com/

    ReplyDelete
  2. thanks gan,, saya lagi nyari tutorial ini. Widgetnya bagus N ringan . .
    kunjungannya balik yaa gan http://jual-gadget-terbaru.blogspot.com/

    ReplyDelete
  3. sipp
    silakan mampir www.venpedia.blogspot.com

    ReplyDelete
  4. kunbal nya ya gan.. hehe..
    http://m-tajuddin-ns.blogspot.com/

    ReplyDelete
  5. akhirnya jadi juga yang ane pengen. thanks banget wat infonya gan
    http://nasrulloh-ibnutora.blogspot.com

    ReplyDelete
  6. wah keren nih bisa melayang2 hehe , saya coba pasang htmlnya gan hehe

    ReplyDelete
  7. artikel yang (Y) iin sedot gan :D
    mampir ke blog ane boleh lho gan muzindo.blogspot.com

    ReplyDelete
  8. Weh, telat!
    kata-rifal.blogspot.com

    ReplyDelete
  9. thanks gan tutorialnya sangat membantu,,,
    http://www.grosiracemaxsdangamatgoldgpurwakarta.com/

    ReplyDelete
  10. akhirnya ketemu juga..Thx gan! :)

    ReplyDelete
  11. Keren banget gan tutorial nya..
    kujungan balik yukk gan..
    http://tourisattraction.blogspot.co.id/

    ReplyDelete
  12. javascript void gan gmn ya cara ngatasinya

    ReplyDelete
  13. Keren.. dan jadinya juga melayang-layang.. heheee..

    ReplyDelete
  14. Bagus button share nya min . .

    tapi lagi nyari yang biasa di bawah artikel aja nih, hehe

    maju terus blog nya :)

    visit ya : http://pepinnono.blogspot.co.id/

    ReplyDelete
  15. mantep bro..
    kunjung baslik ye?
    warung-tutorial.web.id

    ReplyDelete
  16. Artikel yang menarik gan, thanks

    mampir ya: bukuacuan.blogspot.com

    ReplyDelete
  17. mantep makasih..

    mampir gan https://mangkokojo.blogspot.co.id/

    ReplyDelete
  18. sip gan,, makasih info nya,, bisa mampir ke sini https://revolusiinsan.blogspot.com

    ReplyDelete
  19. This comment has been removed by the author.

    ReplyDelete
  20. makasih atas informasinya ya gan :)
    kunjugi blog saya juga di www.aquillien.ml

    ReplyDelete
  21. mantab gaan kunjungi juga blok ane yaa http://www.crystalofknowledge.tk/

    ReplyDelete
  22. the news is very interesting to see. In wait beneath visit
    Kidney Care Capsule

    ReplyDelete
  23. Ko ga jalan ya , kayanya saya salah copas gan

    ReplyDelete
  24. wah sangat membantu gan
    dari kemaren ane cari2

    mmpir di gubuk ane ya http://www.berkahberbagi.info

    ReplyDelete
  25. wah sangat membantu gan
    dari kemaren ane cari2

    mmpir di gubuk ane ya http://www.berkahberbagi.info

    ReplyDelete
  26. eye care softgel

    Nama Produk : Green World eye care softgel.
    Bentuk Sediaan : Softgel/Kapsul Lunak.
    Komposisi : Ekstrak Blueberry, Eyebright, Ekstrak Ginkgo Biloba, Lutein, Riboflavin, Taurine, Ekstrak Biji Anggur dan Zinc.
    Kemasan : Botol plastik @ 100 Softgel/Kapsul Lunak.
    Diproduksi Oleh : World (Tianjin) Nutrition & Health food Co., Ltd. – China.
    Produk : Obat Tradisional.

    Sumber : http://yudaherbal.com/eye-care-softgel/

    http://yudaherbal.com/ | http://obatacemaxstradisional.com | http://manfaatjellygamatgoldg.com | http://qncjellygamattradisional.com | http://kataloggreenworld.com

    ReplyDelete
  27. berhasil gan thanks ya

    mampir juga di blog gue http://gravitycrl.blogspot.co.id/

    ReplyDelete
  28. Perlu di praktekin ini, mantab boss. Thanks infonya. jangan lupa mampir ya.
    Sewa Mobil Avanza Di Malang | sewa mobil di malang | sewa agya di malang

    ReplyDelete

Silahkan Berkomentar Dengan Kata-Kata yang Sopan

Powered By Blogger · Designed By Seo Blogger Templates