Pernah menjadi trend dikalangan blogger. Penerapan header sticky atau header yang selalu tampil statis saat halaman di scroll sampai sekarang pun masih banyak di jumpai pada blog bahkan pada website besar seperti kompas.com, liputan6.com dan masih banyak lagi
Cara menjadikan Header Sticky Median UI 1.6 |
Bukan tanpa alasan. Penerapan header sticky bisa menjadi salah satu cara branding yang efektif kepada pengunjung blog terutama untuk pengguna mobile.
Untuk demonya kalian bisa lihat langsung di bagian header blog ini karena saya sendiri juga menerapkanya
Nah jika kalian ingin menerapkan hal ini maka kalian bisa ikuti cara membuat header menjadi sticky
Penerapan header sticky sebenarnya sudah ada dan dijelaskan oleh creatornya Muhammad Maki
Mungkin sudah banyak yang membagikan cara menjadikan header sticky pada median UI versi 1.4 atau 1.5. namun untuk versi 1.6 ada sedikit perbedaan, silahkan ikuti langkah dibawah ini.
Pada dashbord blogger kalian silahkan masuk ke menu Theme
kemudian Edit HTML
kemudian cari dengan menekan Ctrl + F
temukan kode ini :
/* Remove this to keep header floating */ header{position:relative;border:0}
Jika sudah ketemu silahkan komentari bagian yang saya tandai sehingga hasilnya seperti ini :
<!-- ubah kode ini --> /* Remove this to keep header floating */ header{position:relative;border:0} <!-- menjadi seperti ini --> /* Remove this to keep header floating */ /*header{position:relative;border:0}*/
Jika sudah silahkan save
template kalian dan coba lihat hasilnya
Seharusnya header kalian akan tetap muncul saat di scroll.
Oke jadi begitulah cara mudah membuat header sticky pada median UI 1.6 semoga bermanfaat dan selamat mencoba