Beberapa widget yang harus dipasang pada blog memang perlu dan tidak sebatas modifikasi saja, karena bertujuan untuk mempercantik blog, SEO, maupun mempermudah pengunjung blog. Salah satu widget yang wajib untuk dipasang adalah Tombol share dan Widget pencaian Google CSE, entah itu dipasang pada postingan, HomePage atau disetiap halaman.

Tombol Share MelayangMemasang tombol share pada blog sebaiknya diletakkan pada posisi yang mudah dijangkau pengunjung, tujuannya agar pengunjung tertarik untuk menggunakan widget tersebut dan tentunya mendatangkan traffic dan memperbanyak share blog dan artikel milik anda, tidak hanya itu, konten anda juga harus Relevan agar pengunjung blog anda betah.

Membahas cara memasang tombol share melayang pada blog, jika blog anda telah menggunakan tombol share, sebaiknya ganti dengan tombol share yang saya bagikan berikut ini, karena posisi dan letak tombol share berikut ini nyaman dilihat dan tidak mengganggu pengunjung blog anda.



Copy kode berikut ini:
    

  1. <!-- Start tombol Share - www.the-anarchyta.blogspot.com -->
    2. 

  2. <style>
    3. 

  3. #pageshare {
    4. 

  4.  position:fixed; bottom:15%;
    5. 

  5.  left:10px; float:left;
    6. 

  6.  border: 3px solid #009900;
    7. 

  7.  border-radius:5px;
    8. 

  8.  -moz-border-radius:5px;
    9. 

  9.  -webkit-border-radius:5px;
    10. 

  10.  background-color:transparent;
    11. 

  11.  padding:0 0 2px 0;
    12. 

  12.  z-index:10;}
    13. 

  13. #pageshare .sbutton {
    14. 

  14.  float:left;
    15. 

  15.  clear:both;
    16. 

  16.  margin:5px 5px 0 5px;
    17. 

  17. }
    18. 

  18. .fb_share_count_top {
    19. 

  19.  width:48px !important;
    20. 

  20. }
    21. 

  21. .fb_share_count_top, .fb_share_count_inner {
    22. 

  22.  -moz-border-radius:3px;
    23. 

  23.  -webkit-border-radius:3px;
    24. 

  24. }
    25. 

  25. .FBConnectButton_Small, .FBConnectButton_RTL_Small {
    26. 

  26.  width:49px !important;
    27. 

  27.  -moz-border-radius:3px;
    28. 

  28.  -webkit-border-radius:3px;
    29. 

  29. }
    30. 

  30. .FBConnectButton_Small .FBConnectButton_Text {
    31. 

  31.  padding:2px 2px 3px !important;
    32. 

  32.  -moz-border-radius:3px;
    33. 

  33.  -webkit-border-radius:3px;
    34. 

  34.  font-size:8px;
    35. 

  35. }
    36. 

  36. </style>
    37. 



    

  1. <div id='pageshare' title="Bagikan:">
    2. 

  2. <div class='sbutton' id='gb'>
    3. 

  3.   <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
    4. 

  4.    <fb:like layout="box_count" show_faces="false" font=""></fb:like>
    5. 

  5. </div>
    6. 

  6. <div class='sbutton' id='rt'>
    7. 

  7.  <a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" >Tweet</a>
    8. 

  8.   <script src='http://platform.twitter.com/widgets.js' type="text/javascript"></script>
    9. 

  9. </div>
    10. 

  10. <div class='sbutton' id='gplusone'>
    11. 

  11.   <script type="text/javascript" src="https://apis.google.com/js/plusone.js">
    12. 

  12.  </script><g:plusone size="tall"></g:plusone>
    13. 

  13. </div>
    14. 

  14. <div class='sbutton' id='su'>
    15. 

  15.  <script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>
    16. 

  16. </div>
    17. 

  17. <div class='sbutton' id='digg' style='margin-left:3px;width:48px'>
    18. 

  18.   <script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script>
    19. 

  19.  <a class="DiggThisButton DiggMedium"></a>
    20. 

  20. </div>
    21. 

  21. <div class='sbutton' id='fb'>
    22. 

  22. <a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a>
    23. 

  23.  <script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
    24. 

  24. </div>
    25. 

  25. <br />
    26. 

  26. <div style="clear: both;font-size: 12px;text-align:center;">
    27. 

  27. <a href="http://the-anarchyta.blogspot.com/2013/06/cara-memasang-tombol-share-melayang.html" target="blank"><font color="black">Get this<font></font></font></a></div></div>
    28. 

  28. <!-- End tombol Share - www.the-anarchyta.blogspot.com -->
    29.

Sekarang buka blogger.com, TataLetak, Add Gadget kemudian pilih HTML/JavaScript dan Paste kode diatas, klik Simpan.

Jika anda ingin memodifikasinya, anda harus mengetahui Kode Warna, tujuannya agar dalam memodifikasitombol share melayang tidak terjadi kesalahan. Selamat mencoba!
Terimakasih sudah berkunjung dan membaca artikel mengenai Cara Memasang Tombol Share Melayang