Cara membuat Floating Melayang

1. Login ke blog Rancangan Edit HTML
2. Expend Template dan kemudian cari kode ]]><:/b"skin>
3. Simpan (copy-paste) kode berikut ini tepat di atas kode]]<:/b"skin>
#sharehal {position:fixed; bottom:20%; margin-left:185px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;} #sharehal .tblshare {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;} .sharesoc {display:inline-block;float:right;height:125px;margin:5px 0;width:60px;}
4. Selanjutnya coba anda cari kode </body>
Jika sudah ketemu, simpan (copy-paste) kode di berikut tepat di atas </body>

<div id='sharehal'> <div class='tblshare' 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'/> </div> <div class='tblshare' id='rt'> <script src='http://tweetmeme.com/i/scripts/button.js' type='text/javascript'/> </div> <div class='tblshare' id='su'> <script src='http://www.stumbleupon.com/hostedbadge.php?s=5'/> </div> <div class='tblshare' id='digg'> <script src='http://widgets.digg.com/buttons.js' type='text/javascript'/> <a class='DiggThitblshare DiggMedium'/> </div> <div class='tblshare' 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'/> </a> </div> </div>

5. Terakhir simpan template anda dan lihat hasilnya!:)Keterangan : Untuk mengatur posisi tombol pada cara kedua (Tombol Berbagi Terapung pada Pinggir Artikel) perhatikan kode pada Langkah 4 baris 1 :
  1. bottom:20% = ubah nilai 20% untuk mengatur jarak antara bagian bawah browser dengan tombol
  2. margin-left:185px = ubah nilai 185 untuk mengatur jarak antara bagian pinggir browser dengan tombol
  3. float:left = ubah left ke right jika kita ingin menempatkan tombol di sebelah kanan halaman artikel
  4. background-color:#fff = ubah nilai fff untuh mengatur warna latar belakang dan sesuaikan dengan warna latar belakang artikel blog anda

Posted in

0 Response to "Cara membuat Floating Melayang"

Posting Komentar