Ada dua cara pembuatan tombol back to top ini, berikut penjelasannya:
(Sebelum memasuki penjelasan, download terlebih dahulu template anda, sebagai asuransi tamplate anda...hehe...)
Cara Pertama:
T
Untuk cara pertama ini sangat simple, karena tampilannya sederhana, anda hanya perlu menambahkan kode berikut sebelum kode </body>
<!-- Back to top designed by Blogger Peer - bloggerpeer.blogspot.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img onclick='MGJS.goTop();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7do1cQ3S2pYoK3LqMqm4nwlaymzO5yKnILnCy4s4cnku-unMl6buzhwMh09TPEKi3-p841WxvE_kH_JxDib0YHVu7qVskQLJk_YAg536YBQ0v2G8gapwLGpgH4D55FrTVyEtGA_mV8ZGh/s148/ke%2520atas.png'/></a>
Untuk penjelasannya, anda login dulu ke blogger anda lalu Ikuti tahap-tahap berikut ini:
1. Pilih Rancangan
2. EDIT HTML ( Centang Expand Template Widget )
3. Cari Kode </body> ( Untuk lebih cepat mencari gunakan Ctrl+F )
4. Simpan kode berikut sebelum atau di atas kode </body>
<!-- Back to top designed by Blogger Peer - bloggerpeer.blogspot.com -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img onclick='MGJS.goTop();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7do1cQ3S2pYoK3LqMqm4nwlaymzO5yKnILnCy4s4cnku-unMl6buzhwMh09TPEKi3-p841WxvE_kH_JxDib0YHVu7qVskQLJk_YAg536YBQ0v2G8gapwLGpgH4D55FrTVyEtGA_mV8ZGh/s148/ke%2520atas.png'/></a>
5. Lalu simpan tamplate, SELESAI dan lihat hasilnya…
Keterangan:
- Kode warna kuning adalah posisi tombol berada
- Kode warna merah adalah URL gambar tombol (silahkan anda ganti dengan URL gambar anda bila ingin menyesuaikan gambarnya dengan selera anda)
No comments:
Post a Comment
TINGGALKAN PESAN DAN KESAN SETELAH BERKUNJUNG