Berbagai cara menghilangkan Navigasi Bar dan Auto Hide Navigasi Bar

NavBar adalah tombol navigasi yang terletak di atas header, yang berfungsi untuk
memudahkan blogger sign in dan melakukan pengaturan,
tetapi ada sebagian pengguna blog yang tidak menyukai navbar tersebut, karena dianggap kurang menarik, ataupun ada tujuan lain.
untuk menghilangkan navbar tersebut, atau hanya sekedar menyembunyikan secara otomatis, cmari ikuti langkah dibawah ini:

1. Pilih rancangan > edit Html > centang ekspand templete widgete

3. Cari kode I[CDATA[
Tekan CTRL + F pada keyboard dan tulis kode tersebut agar mencari ( kompatible dgn Mozilla / Google Crhome).

#navbar {
  height: 0px;
 visibility: hidden;
 display: none;
}

atau cari kode body { letakkan kode diatas tersebut tepat diatas kode body{
klik simpan templete

#navbar {
  height: 0px;
 visibility: hidden;
 display: none;
}

Cara Lain Untuk menyembunyikannya, anda bisa gunakan prosedur berikut:
1. Jika sudah Login, masuk ke Rancangan/Design

2. Pilih  Edit Html => Centang "Expand Template Widget" ini penting
   atau backup dengan mengklik download lengkap templete,
untuk menyimpan tempete anda sebelum perubahan, agar menghindari kesalahan/ error

3. cari kode seperti di bawah ini

![CDATA[

4. Masukkan kode berikut setelah kode di atas

    #navbar {
    height: 0px;
    visibility: hidden;
    display: none;
    }

5. Klik tombol SIMPAN Template. Silahkan Lihat perubahan pada blog anda.

Catatan:
Jika di template anda menemukan kode
/*-- teks */
letakkan script setelah /* --teks --*/
karena script atau teks yang ada dalam cakupan /* teks */ tidak diproses, karena dianggap sebagai keterangan.
Contoh:

![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: Rounders 3
Date: 27 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */

diubah menjadi:

![CDATA[/*
-----------------------------------------------
Blogger Template Style
Name: Rounders 3
Date: 27 Feb 2004
Updated by: Blogger Team
----------------------------------------------- */
#navbar {
height: 0px;
visibility: hidden;
display: none;
}

Selain menghilangkan navbar, kita juga dapat membuat navbar autohide, yaitu navigation bar
(nav bar) akan muncul saat mouse beada di posisi paling atas blog, jika mouse digerakkan/atau dipindahkan dari lokasi navbar, maka navbar akan menghilang(disembunyikan)

Untuk kasus Navbar autohide, cukup ganti kode

#navbar {
height: 0px;
visibility: hidden;
display: none;
}

menjadi:

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

atau dengan cara menambahkan kode di bawah ini pada style sheet CSS :

/* hidden navbar
----------------------------- */

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

Atau bisa juga meletakkan kode berikut persis di bawah kode <body> :

<style type='text/css'>
#navbar-iframe {display:none;}
</style>

Mau pilih yang mana? Semuanya mempunyai fungsi yang sama yaitu menghilangkan navbar.
Masih bingung juga dengan Konfigurasi sepereti kode di atas?
silahkan ikuti langkah-langkah berikut ini :

A.  Untuk template klasik

1. Sign in di blogger

2. Klik menu Template

3. Klik menu Edit HTML

4. Copy seluruh kode yang ada lalu save di komputer,sebagai backup data agar aman

5. Copy kode berikut lalu paste di atas kode </style>

      /* hidden navbar
      ----------------------------- */

      #navbar-iframe {
      height:0px;
      visibility:hidden;
      display:none
      }

6. Klik tombol Simpan Perubahan Template

7. Selesai.


B.  Untuk template baru

1. Sign in di blogger
2. Klik menu Layout
3. Klik menu Edit HTML
4. Klik link bertuliskan Download Template Seluruhnya, silahkan save dulu untuk backup data
5. Copy kode berikut lalu paste di atas kode ]]></b:skin> ( untuk mode templete spt saya)

      /* hidden navbar
      ----------------------------- */
      #navbar-iframe {
      height:0px;
      visibility:hidden;
      display:none
      }

6. Klik tombol Simpan Template

7. Selesai.


The following is how to remove blogger navbar:
  1. Please login to blogger with your ID.
  2. Click Design.
    blogger design
  3. Click Edit HTML.
    blogger edit html
  4. Do the backup to your blog by clicking Download Full Template.
    download full template
  5. Find the code ]]></b:skin>
  6. Copy and paste the code below exactly above the code ]]></b:skin>
    #navbar-iframe{display:none;height:0;visibility:hidden;} 
  7. Click SAVE TEMPLATE.
  8. Done. See the result and Blogger Navbar should have been disappeared from your blog.
  9. The following is how to remove blogger navbar:
    1. Please login to blogger with your ID.
    2. Click Design.
      blogger design
    3. Click Edit HTML.
      blogger edit html
    4. Do the backup to your blog by clicking Download Full Template.
      download full template
    5. Find the code ]]></b:skin>
    6. Copy and paste the code below exactly above the code ]]></b:skin>
      #navbar-iframe{display:none;height:0;visibility:hidden;} 
    7. Click SAVE TEMPLATE.
    8. Done. See the result and Blogger Navbar should have been disappeared from your blog.

semoga Uraian diatas dapat dipahami, semoga bermanfaat.

No comments:

Post a Comment

Followers