Rabu, 18 April 2012

Cara Membuat Back To Top Di Blog

Hai Sobat Bithoo Emmm kali ini postingan yang di Muat di Bithoo yaittu Cara Membuat Fitur Back To Top... Emmm itu apa yah dan Cara buatnya gimana yah,,,,??? Yuk kita langsung cari tahu aja sama-sama. Back to Top Button atau Tombol Kembali ke Atas adalah fitur blog yang mempermudah pengunjung/visitor blog kembali ke bagian atas halaman dengan sekali klik tanpa melakukan mouse scrolling. Efeknya sangat besar sekali terutama bagi blog yang memiliki halaman panjang. Letak dari tombol fitur back to top kali ini ada di bagian footer sebelah kanan.

Cara menambahkan fitur 'Back To Top' untuk Blogger-Blogspot:
1. Masuk ke edit HTML.
2. Cari kode tag </body> (Ctrl+F)
3. Masukkan kode berikut di atas </body>:
 
<a href='#' style='position: fixed; right: 15px; bottom: 15px; outline: medium none; border: 0px none;' title='Back to Top'><img alt='Back to Top' border='0'src='alamat url gambar Back to Top-mu'/></a>

Ganti title Back to Top dengan kata-kata yang disuka, misalnya 'return to top', 'kembali ke atas', 'balik ke atas', 'meluncur ke atas', 'balikan nyook', atau 'kembali ke laptop'... terserahlah, suka-suka elo... ^_^ Fungsinya untuk notifikasi ke pengunjung tentang kegunaan tombol tersebut.

Alt Back to TOP lebih baik ditinggalkan begitu saja kalo-kalo gambar gagal dimuat browser jadi tulisan itu masih nongol sebagai pengganti.

Gunakan gambar berikut, klik kanan copy (save as), trus upload dan host sendiri ya gambarnya, biar gak lelet and pengunjung gak melet-melet!


Atau Googling (cari juga di photobucket.com) gambar 'back to top/kembali ke atas' sendiri yang lebih keren dan sesuai dengan warna dan ukuran footer blog-mu, gunakan keyword "back to top button image", kemudian upload dan host gambar itu.

Ambil/copy direct link gambar dan ganti alamat url gambar Back to Top-mu dengan alamat url/link tersebut. Contoh:
 
<a href='#' style='position: fixed; right: 15px; bottom: 15px; outline: medium none; border: 0px none;' title='Back to Top'><img alt='Back to Top' border='0'src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTEEY6ow_anDMA5ydKREJcGvp1x-jJqC-hy6dcyHXp1dngGNleT2aOaxlMCoRoLqfsTYMr5uxAlEy1A4XNaho41m6NQqjh4cMns0IDJGahQVtkS9Z9WAYuPJbMLEUPv-aLn3jEWi48S5w/s1600/back+to+top+3.png'/></a>

Oke, udah? Belum? Buruan lah!

4. Kalau sudah dimasukkan semuanya dan pastikan tidak ada yang terlewat, save template HTML-nya.
5. Done! Fitur/Button Back To Top siap digunakan.

Nah Sobat Bithoo Sudah Pada Tahu kan semua apa yang dimaksud Back To Top dan Cara Membuatnya,,, Semoga postingan ini dapat membantu bagi para sobat Blog yang setia bersama Bithoo.

Ditulis Oleh : Unknown ~ Bithoo Trik dan Tips

Anda sedang membaca sebuah artikel yang berjudul Cara Membuat Back To Top Di Blog,, Semoga artikel tersebut bermanfaat untuk anda, Dan mohon maaf karena Bithoo dalam pengembangan jadi maaf klau ada yang kurang berkenan. Dan apa bila sobat Bithoo ingin artikel ini di blog sobat Bithoo silahkan menggunakan kode dibawah ini.

:: Thank you for visiting ! ::

0 komentar:

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Posting Komentar

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Bithoo | Bloggerized by Lasantha - Premium Blogger Themes | Bluehost