- Back to Home »
- TipsnTrick »
- Tips Memasang Tombol BecK to Up
Posted by : Unknown
Minggu, 10 November 2013
Tips dan trick ini sudah saya
peragakan di blog saya. singkat cerita mari kita simak saja Cara Memasang
Tombol Kembali Ke Atas Dan Kembali Turun berikut ini.
Cara Memasang Tombol Back to Top
Memasang tombol kembali ke atas atau
memasang tombol back to top ini mungkin bagi blog saya ini sangat diperlukan,
karena untuk menyikapi blog yang terlalu memanjang kebawah, mungkin masalah ini
tidak akan ditemui jika kita memasang template yang sudah menyertakan widget
ini, tetapi jika belum ada kita bisa memasangnya sendiri, karena jika tidak ada
tombol back to top akan membosankan pembaca blog kita, apalagi jika menggunakan
mouse yang kebetulan keadaannya sudah letoy (hehe…) atau lebih parahnya lagi
sudah tidak ada scroll nya lagi, itu akan membuat mereka capek untuk mengakses
blog kita, maka alternatifnya adalah membuat tombol back to top atau tombol
kembali ke atas.
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:
Untuk cara pertama ini sangat simple, karena tampilannya sederhana, anda hanya perlu menambahkan kode berikut sebelum kode </body>
<!-- Bact to top By barengngeblog -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDC7AQSJxgg39uul7pK7nziTIMIt3mhmcRF0JxwUoE5Hj5Uwup6uS5P2xAC-UAVwkR6Kv-k_Z3XgtfgK_9dhFhlKiCIuHxrtDMBguWybxbEvCZGIMkKyzDbLKY_BG19Sj714N-B3Gj2czP/s1600/Untitled-2.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>
<!-- Bact to top By BarengNgebloG -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDC7AQSJxgg39uul7pK7nziTIMIt3mhmcRF0JxwUoE5Hj5Uwup6uS5P2xAC-UAVwkR6Kv-k_Z3XgtfgK_9dhFhlKiCIuHxrtDMBguWybxbEvCZGIMkKyzDbLKY_BG19Sj714N-B3Gj2czP/s1600/Untitled-2.png'/></a>
5. Lalu simpan tamplate, SELESAI dan lihat hasilnya…
Keterangan:
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:
Untuk cara pertama ini sangat simple, karena tampilannya sederhana, anda hanya perlu menambahkan kode berikut sebelum kode </body>
<!-- Bact to top By barengngeblog -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDC7AQSJxgg39uul7pK7nziTIMIt3mhmcRF0JxwUoE5Hj5Uwup6uS5P2xAC-UAVwkR6Kv-k_Z3XgtfgK_9dhFhlKiCIuHxrtDMBguWybxbEvCZGIMkKyzDbLKY_BG19Sj714N-B3Gj2czP/s1600/Untitled-2.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>
<!-- Bact to top By BarengNgebloG -->
<a href='#' style='display:scroll;position:fixed;bottom:5px;right:5px;' title='Back to Top'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDC7AQSJxgg39uul7pK7nziTIMIt3mhmcRF0JxwUoE5Hj5Uwup6uS5P2xAC-UAVwkR6Kv-k_Z3XgtfgK_9dhFhlKiCIuHxrtDMBguWybxbEvCZGIMkKyzDbLKY_BG19Sj714N-B3Gj2czP/s1600/Untitled-2.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)Post-post Terpopuler
-
OK buat para sobat Blogger yang mempunyai Twitter yang berisikan konten-konten pada Blog-nya. Posting ini adalah salah satu solusi untuk m...
-
Pada Prinsipnya Membuat Sebuah blog itu Identik dengan kata-kata dan Tulisan yang sangat Panjang. kadang kadang kita berfikir apabila menuli...
-
Oke Buat Sobat Blogger...... Kemarin aku udah Update Untuk Teks Berjalan tapi Sobat Cuma Bisa ganti Tulisan aja tanpa bisa ganti Warna dan...
-
Nah Buat Sobat Blogger Yang Berminat Menerapkan Pada Blog Sobat Semua, Sobat Bisa Ikuti Caranya Dibawah ini: Login Ke Akun Blogger So...
-
Masih seperti biasanya Sob.... Coz Blog identik dengan HTML makanya semua Widget yang di buat selalu seperti ini menggunakan cara yang s...
-
Cara Membuat Cursor Bertabur Bintang Mempercantik atau memperindah tampilan Blog adalah naluri dari setiap blogger .dan jikalau tamp...
-
Untuk cara pemasangan di halaman postingan berikut tutorialnya . 1. Login ke akun blog sobat 2. Klik Entri baru kemudian beri judul sesu...
-
Oke Langsung Saja nih Pergi ke Template > Edit HTML , lalu centang "Expand Template Widget" setelah itu cari kode </he...
-
Berikut langkah-langkah pembuatannya : Klik Untuk Liat Kode 1. Login ke Blogger 2. Masuk ke Template >> Edit HTML (centa...
-
Posting selanjutnya .............. Cara Membuat Fanspage Melayang Di Blog- kita pasti pernah melihat kotak facebook melayang di blog, pas...