Cara Buat Auto Hide Navbar Pada Blog
Sunday, May 20, 2018
Add Comment
Pada kesempatan sebelumnya kita sudah membahas bagaimana cara menghilangkan navbar pada blog. Nah, pada kesempatan kali ini kita akan membahas bersama perihal bagiamana caranya untuk menciptakan auto hide navbar pada blog.
Menghilangkan navbar dengan auto hide navbar memang mempunyai fungsi yang sama, adalah sama-sama dipakai untuk menyembunyikan tampilan navbar semoga tidak terlihat dalam halaman blog kita. Akan tetapi, kalau dengan cara menghilangkan navbar maka navbar blog memang secara permanen akan hilang dan tidak muncul lagi di halaman blog kita. Sedangkan auto hide navbar memang menciptakan navbar menjadi hilang di tampilan halaman blog, tetapi navbar akan otomatis/auto muncul seketika ketika kursor mengarah pada bab paling atas dari tampilan blog kita dan akan hilang kembali ketika kursor menjauhi bab paling atas halaman blog kita.
Bagaimana cara menciptakan auto hide navbar pada blog ini?
Pertama, masuk ke dalam akun blogger kita masing-masing.
Kemudian klik fitur rancangan.
Klik edit HTML.
Contreng Expand Template Widget.
Cari arahan HTML berikut ini.
Kemudian tempelkan arahan HTML berikut ini sempurna di atas arahan HTML di atas.
Contoh penerapannya.
Klik simpan template dan selesai.
Keterangan :
Sekarang coba kita lihat tampilan halaman depan blog kita. Bagaimana hasilnya? Navbar blog kita menjadi hilang bukan? Lalu, coba arahkan kursor mouse pada bab paling atas blog, maka seketika navbar akan muncul dengan otomatis. Dan ketika kursor tersebut dijauhkan dari bab atas blog, maka navbar akan kembali tersembunyi dengan sendirinya.
Cara ini mungkin tidak akan kuat apa-apa ketika sebelumnya kita memakai template blog yang memang sudah disembunyikan navbarnya. Cara ini sangat berkhasiat ketika kita masih memakai template bawaan blogspot dan tidak menghendaki tampilan navbar dalam blog kita tersebut.
Ada yang ingin menambahkan?
Jika ada jawaban silakan disampaikan lewat kotak komentar di bawah ini ya kawan.
Salam blogger!
Menghilangkan navbar dengan auto hide navbar memang mempunyai fungsi yang sama, adalah sama-sama dipakai untuk menyembunyikan tampilan navbar semoga tidak terlihat dalam halaman blog kita. Akan tetapi, kalau dengan cara menghilangkan navbar maka navbar blog memang secara permanen akan hilang dan tidak muncul lagi di halaman blog kita. Sedangkan auto hide navbar memang menciptakan navbar menjadi hilang di tampilan halaman blog, tetapi navbar akan otomatis/auto muncul seketika ketika kursor mengarah pada bab paling atas dari tampilan blog kita dan akan hilang kembali ketika kursor menjauhi bab paling atas halaman blog kita.
Bagaimana cara menciptakan auto hide navbar pada blog ini?
Pertama, masuk ke dalam akun blogger kita masing-masing.
Kemudian klik fitur rancangan.
Klik edit HTML.
Contreng Expand Template Widget.
Cari arahan HTML berikut ini.
body {
Kemudian tempelkan arahan HTML berikut ini sempurna di atas arahan HTML di atas.
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}
Contoh penerapannya.
/* Content
----------------------------------------------- */
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}
body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
padding: 0 $(content.shadow.spread) $(content.shadow.spread)
----------------------------------------------- */
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}
body {
font: $(body.font);
color: $(body.text.color);
background: $(body.background);
padding: 0 $(content.shadow.spread) $(content.shadow.spread)
Klik simpan template dan selesai.
Keterangan :
- Sebelum memulai proses editing arahan HTML template, sebaiknya download template blog kita terlebih dahulu sebagai langkah antisipasi kalau kita mengalami kegagalan ketika proses editing berlangsung.
- Gunakan tombol Ctrl + F pada keyboard untuk mempermudah pencarian arahan HTML yang kita inginkan.
Sekarang coba kita lihat tampilan halaman depan blog kita. Bagaimana hasilnya? Navbar blog kita menjadi hilang bukan? Lalu, coba arahkan kursor mouse pada bab paling atas blog, maka seketika navbar akan muncul dengan otomatis. Dan ketika kursor tersebut dijauhkan dari bab atas blog, maka navbar akan kembali tersembunyi dengan sendirinya.
Cara ini mungkin tidak akan kuat apa-apa ketika sebelumnya kita memakai template blog yang memang sudah disembunyikan navbarnya. Cara ini sangat berkhasiat ketika kita masih memakai template bawaan blogspot dan tidak menghendaki tampilan navbar dalam blog kita tersebut.
Ada yang ingin menambahkan?
Jika ada jawaban silakan disampaikan lewat kotak komentar di bawah ini ya kawan.
Salam blogger!
0 Response to "Cara Buat Auto Hide Navbar Pada Blog"
Post a Comment
Blog ini merupakan Blog Dofollow, karena beberapa alasan tertentu, sobat bisa mencari backlink di blog ini dengan syarat :
1. Tidak mengandung SARA
2. Komentar SPAM dan JUNK akan dihapus
3. Tidak diperbolehkan menyertakan link aktif
4. Berkomentar dengan format (Name/URL)
NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!".
Klik subscribe by email agar Anda segera tahu balasan komentar Anda