Thursday, 22 December 2011

Cara membuat tombol share melayang facebook, twitter, dan google+ di blogger


Tombol share memanglah sangat penting kebaradaanya di blog, dengan keberadaan tombol share ini juga dapat meningkatkan intensitas promosi content yang baru saja di posting baik itu oleh admin ataupun oleh pengunjung lain yang tertarik pada artikel yang telah diposting.




Berikut adalah cara membuat tombol share  facebook, twitter, dan google+ melayang di blogger.

  1. Pertama login ke akun blogger sobat..
  2. Pilih menu Rancangan > Elemen Laman > Tambah gadget
  3. Setelah muncul window baru pilih HTML/JavaScript
  4. Kemudian pastekan kode berikut
  5. <style>
    #pageshare {position:fixed; bottom:25%; margin-left:-83px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;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;/*bs-fsmsb*/-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="shareiniitu">
    <div class="sbutton" id="fb">
    <a href="http://www.facebook.com/sharer.php" name="fb_share" type="box_count">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript">
    </script></div>
    <div class="sbutton" id="rt">
    <script src="http://tweetmeme.com/i/scripts/button.js" type="text/javascript">
    </script></div>
    <div class="sbutton" id="gb">
    <a class="google-buzz-button" data-button-style="normal-count" href="http://www.google.com/buzz/post" title="post on google buzz">
    <script src="http://www.google.com/buzz/api/button.js" type="text/javascript">
    </script>
    </a></div>
    <div class="sbutton" id="gplusone">
    <script src="http://apis.google.com/js/plusone.js" type="text/javascript">
    </script>
    <g:plusone size="tall"></g:plusone></div>
    </div>
  6. Setlah selesai Simpan
  7. dan lihat hasilnya

1 komentar so far

Info bagus sobat.
Salam blogger.

Silahkan berkomentar dengan bijak. Setelah anda mampir dan berkomentar, saya akan berkunjung balik. Dan jangan meninggalkan link hidup ya, Terimakasih :)
EmoticonEmoticon