Membuat Floating Follow


halo sobat blogger,
kali ini saya mau share, cara membuat floating-folowing-blogger,
untuk lebih jelasnya seperti gambar dibawah ini : 


kalo kawan minat untuk mencobanya silahkan ikuti langkah-langkah di bawah ini :
  1. Login ke blogger
  2. Pilih rancangan,
  3. Tambahkan gadget
  4. dan masukan script dibawah ini :
    <style type="text/css">
    .barrightblogger{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3uCeLdnIla6VviGV2EKBFohyphenhyphen0kDJPOt01ORVFrpek9tzkc_3O7_6ZI8t90aI55zF66tFwv5uH9ROoPCDOmuEqNjh6Kzp6sZge78t9Qb0RsE-j08GGNNLPRM86S3HINBytlhL2tBHZjyvL/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:50px; z-index:1000;}
    .barrightbloggerc{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpXqNXb0mvKJg1DT0HShEunO-WY_SPmPUd3lJCATyAwu8FnQZ331I-i5-G2pTMvV64nOA1v8nPFTQYRuufd3Fv79nk7udQE3cH_1Q879gxZQNgbEC9Dypzr5hcSVo7VNIcnOhfts7PykrL/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:50px; z-index:1100;}
    .barconteblogger{margin:5px 0 0 47px}

    .barrighttwitter{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjf_JYCwp6l-O4SD0m5F4DyAReZseN8kRnY_E27dUOGr_1wdnIkN4BHx7-tjnm8qjAYtaSD7SWGO40qU2PM9_YqVmYX-y7KludOCKPrZQEdh_yOcwq2RlU_58yhOkQfhVFZwBw4FVHPV7CY/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:210px;z-index:1000;}
    .barrighttwitterc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgj0WEDjxwNXffICJVQVVyP4K-2bHrUjB2X7Gx13wWg2MlTYp-LJmB6nzMUKJ_1DL8LsjkE4x7Y7tTl_1yZDnaYCUB5vfzYGfIyGG7oKUTR8PKqOyI2z3i-Fi2LrrOLVwRKroX4JjoDLkUu/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:120px; z-index:1100;}
    .barcontetwitter{margin:5px 0 0 47px}

    .barrightfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn4dsaEn8sRkgIFwLtIG3W9pjkrbFqtrHQVIOsagQCpnDwXVTRONKMIlm5ohNkTO6fJ7fc09Kx0v0HCjb8kcXP2dyt_fwc_SxxRAV7fY7uZADpxqvN5jUdHk78tXth1Iqyv7EPkaYBBN0E/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:370px; z-index:1000;}
    .barrightfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTKQOml6njLfUAZhOkm5YJUUSj8ZMpwh_akVMCC4SiSNDRHNvg8fzOuVNfOtQmUfxvrxVYg0lmjG6QfAfOhGi4QgnV3SQ79h5ssC4dMpsoApz6CYbEvm1qA8hm8p8WsKyKomPVTzAatpje/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:185px; z-index:1100;}
    .barcontefacebook{margin:5px 0 0 47px}
    </style>

    <div class="barrightblogger" onmouseover="this.className='barrightbloggerc'" onmouseout="this.className='barrightblogger'">
    <div class="barconteblogger">

    ID BLOG KAMU

    </div>
    </div>

    <div class="barrighttwitter" onmouseover="this.className='barrighttwitterc'" onmouseout="this.className='barrighttwitter'">
    <div class="barcontetwitter">

    ID TWITTER KAMU

    </div>
    </div>

    <div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'">
    <div class="barcontefacebook">

    <style type="text/css">
    .barrightfacebook{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn4dsaEn8sRkgIFwLtIG3W9pjkrbFqtrHQVIOsagQCpnDwXVTRONKMIlm5ohNkTO6fJ7fc09Kx0v0HCjb8kcXP2dyt_fwc_SxxRAV7fY7uZADpxqvN5jUdHk78tXth1Iqyv7EPkaYBBN0E/');background-repeat:no-repeat;width:39px;height:159px;position:fixed;right:0px;top:370px; z-index:1000;}
    .barrightfacebookc{background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTKQOml6njLfUAZhOkm5YJUUSj8ZMpwh_akVMCC4SiSNDRHNvg8fzOuVNfOtQmUfxvrxVYg0lmjG6QfAfOhGi4QgnV3SQ79h5ssC4dMpsoApz6CYbEvm1qA8hm8p8WsKyKomPVTzAatpje/');background-repeat:no-repeat;width:288px;height:345px;position:fixed;right:0px;top:185px; z-index:1100;}
    .barcontefacebook{margin:5px 0 0 47px}
    </style>

    <div class="barrightfacebook" onmouseover="this.className='barrightfacebookc'" onmouseout="this.className='barrightfacebook'">
    <div class="barcontefacebook">
   
    ID FACEBOOK KAMU

    </div>
    </div>

    </div>
    </div>

         5.  Simpan dan lihat hasilnya



Selamat mencoba dan semoga berhasil 

  Terimakasih

Tidak ada komentar:

Posting Komentar