Minggu, 06 Januari 2013

Desain Blog : Trik Modiv Tampilan Navbar dengan Efek Opacity

Tutorial kali ini akan memberikan solusi mudah untuk menanggapi masalah Navbar Blogger. Bagaimana cara agar Navbar tidak mengganggu penampilan blog tetapi tidak melanggar TOS (term of service) Blogger.
  
Solusinya adalah membuat Navbar tersebut seakan tidak ada, melainkan ada ketika crusor mouse kita berada pada bagian navbar (atas), atau bisa kita namakan antara ada dan tiada. Semua itu dengan cara memodifikasi tampilan Navbar dengan Efek Opacity. tampilannya seperti yang Trik Tips Tutorial gunakan dan cara membuatnya sangatlah mudah : 

I. Bagi Template yang tidak terdapat Navbar pada tampilan Blog :
1. Setelah Login Blogger
2. Kemudian Tata Letak ~> edit HTML
3. Cari kode #navbar-iframe atau lengkapnya seperti ini : 
#navbar-iframe{display:none;height:0;visibility:hidden;}
4. Ganti semua kode tersebut dengan : 
#navbar-iframe{opacity:0.0; filter:alpha(Opacity=0)} 
#navbar-iframe:hover{opacity:1.0; filter:alpha(Opacity=100,FinishedOpacity=100)}
5. Simpan dan lihat hasilnya

II. Bagi Template yang terdapat Navbar pada tampilan Blog :
1. Setelah Login Blogger
2. Kemudian Tata Letak ~> edit HTML
3. Cari kode :
<b:skin><![CDATA[
4. Masukkan kode dibawah ini setelah kode diatas :
#navbar-iframe{opacity:0.0; filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0; filter:alpha(Opacity=100,FinishedOpacity=100)}
5. Simpan dan Selesai lihatlah hasilnya..
Tutorial Terkait: 

Tidak ada komentar: