Sabtu, 10 September 2011

Cara Memasang Floating Share Button Melayang Pada Blog

Kali ini saya mau share lagi nih sama readers AYRIY ZONE semua, tak bosan-bosannya saya share pada readers AYRIY ZONE, Setelah kemarin saya membahas mengenai cara modifikasi recent post, yaudah tanpa panjang lebar ngomongnya langsung aja, kita akan membahas Cara Memasang Floating Share Button Melayang pada Blog. Sebelum membuatnya lihat Demo Disini
Ok untuk langkah-langkahnya langsung aja ke tkp :
  • Login aja langsung ke Blogger
  • Cari Rancangan - Tata Letak - Add Widget - Html/Javascript
  • Copy paste kode di bawah ini kedalamnya :
    <style>
    #pageshare {position:fixed; bottom:15%; margin-left:-71px; 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="Get this from khamardos.blogspot.com">
    <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>
     Tulisan yang bercetak tebal bisa anda ganti dengan right, terserah selera anda.
     Selamat mencoba.

    Tidak ada komentar:

    Posting Komentar