CARA MEMBUAT TOMBOL KEMBALI KE ATAS KEREN (BACK TO TOP) DI BLOG

Salam bloger..... kali ini saya akan memposting cara membuat tombol kembali keatas (back to top) di blog sobat. tombol kembali keatas ini digunakan untuk memudahkan pengunjung untuk kembali katas suatu halaman blog tanpa harus scroll di samping. hal ini dilakukan biasanya apabila halaman pada sebuah blog yang di baca cukup panjang. 

tombol ini biasanya diletakan pada bagian pojok bawah blog, hal ini untuk memudahkan pengunjung untuk melihat tombol tersebut. apabila tombol ini di klik , maka tampilan halaman blog secara otomatis akan bergulir ke halaman atas ( tampilan awal ketika halaman dibuka). tombol ini akan mudah terlihat karena tombol ini bergerak mengikuti tampilah halaman yang sedang di baca pengunjung.




berikut ini langkah - langkah pembuatan tombol kembali ke atas (back to top ) :

  1. buka halaman dashboard blog sobat.
  2.  pilih menu tata letak (layout)
  3. tambahkan gadget baru , pilih java script/HTML
  4. salin kode di bawah ini kedalam java script/HTML tersebut
<style type="text/css">.backtotop a:hover{background:0}</style><div class="backtotop"><a style="display:scroll;position:fixed;z-index:100;bottom:5px;right:5px" class="backtotop" href="#" rel="nofollow" title="Back to Top"><img style="border:0;width:60px;height:60px" src="https://lh3.googleusercontent.com/-8_OnYTsrPuI/Uk3FOKMpZfI/AAAAAAAACLI/pLJP-aPniCo/s144/2.png"/></a></div>

      5. selanjutnya simpan (save). dan refresh halaman blog anda untuk melihat hasilnya

note :  warna hijau merupakan lebar ikon tombol (ukuran nya dapat di ubah sesuai keinginan anda)
           warna biru merupakan tinggi ikon tombol (ukuran nya dapat di ubah sesuai keinginan anda)
           warna kuning merupakan url gambar icon yang bisa anda ganti (contoh gambar dibawah ini)


selamat mencoba dan semoga dapat bermanfaat.

Post a Comment

0 Comments