Salah satu navigasi yang akan memudahkan pengunjung untuk kembali ke bagian atas dari suatu halaman (scroll) dengan cepat yaitu adanya tombol go top atau back to top yang biasanya terpasang pada bagian footer. Beberapa theme Woordpress ada yang sudah menyertakan tombol tersebut tapi ada juga yang belum.
Blog ini tadinya juga ada tombol go top atau back to top bawaan dari theme inove yang saya gunakan, tapi karena menggunakan gambar dan javascript akhirnya tombol tersebut saya lepaskan. Dan baru hari ini (baru sempat) tombol go top atau back to top tersebut saya pasang kembali di blog ini setelah sedikit saya modifikasi dengan tanpa menggunakan gambar dan javascript.
Jika ada yang berminat berikut ini cara membuatnya :
1. Buka file footer.php, bisa lewat dahboard, cpanel atau FTP.
2. Kemudian tambahkan kode HTML berikut ini di dalamnya :
3. Untuk pengaturan posisinya tambahkan kode CSS berikut ini ke dalam file CSS yang anda gunakan.
Jika ada yang kurang pada tutorial tersebut di atas silahkan anda tambahkan pada bagian komentar.
Blog ini tadinya juga ada tombol go top atau back to top bawaan dari theme inove yang saya gunakan, tapi karena menggunakan gambar dan javascript akhirnya tombol tersebut saya lepaskan. Dan baru hari ini (baru sempat) tombol go top atau back to top tersebut saya pasang kembali di blog ini setelah sedikit saya modifikasi dengan tanpa menggunakan gambar dan javascript.
Jika ada yang berminat berikut ini cara membuatnya :
1. Buka file footer.php, bisa lewat dahboard, cpanel atau FTP.
2. Kemudian tambahkan kode HTML berikut ini di dalamnya :
Go Top ↑Penempatan kode silahkan disesuaikan dengan kode-kode yang lain yang ada di bagian footer tersebut, seperti kode tentang blog info, theme info dll. Anda bisa mengganti karakter /logo ↑ (↑) dengan Δ (Δ)3. Untuk pengaturan posisinya tambahkan kode CSS berikut ini ke dalam file CSS yang anda gunakan.
a#gotop
{float:right;
height:16px;
display:block;
padding-left:16px;
margin:5px 15px 0 0;
text-decoration:none;
line-height:18px;
font-size:11px;}Catatan : Tombol Go Top/Back To Top ini sengaja saya buat tanpa menggunakan gambar dan javascript supaya loadingnya tetap ringan. Jika ada yang menginginkan menggunakan gambar anda bisa menambahkan URL gambar anda sebagai background pada ID gotop properties tersebut di atas.Jika ada yang kurang pada tutorial tersebut di atas silahkan anda tambahkan pada bagian komentar.
Artikel Yang Mungkin Berkaitan :
Categories: Optimasi WordpressCara pasang tombol go top/back to top di wordpress ∞ Navigasi blog ∞ back to top ∞ Membuat Tombol Go Top ∞ menambah tombol scroll to top pada blog ∞ cara bikin go to home ∞ cara memakai scroll to top ∞ membuat tombol kembali di php ∞ membuat tombol back to top pada wordpress ∞ membuat tombol back bergambar di blogge ∞ membuat javascript gambar ∞ membuat button back on top ∞ cara bikin tombol ∞ cara membuat tombol top ∞ Cara Membuat Tombol Back To Top Di Wordpress ∞ cara membuat back to top ∞ cara memasang scroll to top di blog ∞ Cara menampilkan back to top pada wordpress
Comments (24)
Tidak ada komentar:
Posting Komentar