Loading... Please wait

Cara Membuat Menu Dibawah Header


Membuat menu header blog itu sangat mudah. Manfaatnya adalah mempermudah user / pengunjung blog bernavigasi di blog kita, sehingga memperbesar pageview.

Berikut adalah screenshot yang Tutorial Blogger miliki


Sebelum kita mulai langkah-langkahnya sebaiknya baca doa terlebih dahulu agar semua ini berjalan dengan lancar :)

Ayo kita mulai
1. Masuk ke Dasboard lalu klik Blog sobat
2. Pilih ke Template
3. Lalu pilih Edit HTML dan pilih lanjutkan
4. Centang Expand Template Widget
5. Cari kode

<b:section class='header' id='header' 



(Gunakan CTRL + F atau F3 Untuk mempercepat pencarian)
6. Setelah ketemu sobat akan melihat kode seperti ini
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='x-Demo (Header)' type='Header'>
<b:includable id='main'>
7. Ganti angka 1 menjadi 2 dan ganti kalimat no menjadi yes
8. Setelah itu cari kode
]]> </ b: skin>
  (Gunakan CTRL + F atau F3 Untuk mempercepat pencarian)
9. Hapus kode tersebut dan ganti dengan kode berikut ini

a.navigation {
background: # 000;
color: # FFF;
margin: 1px;
padding: 2px;
border-width: 0;
text-transform: Uppercase;
text-decoration: none;
font-weight: bold;
}
a.navigation: hover {
background: # 000;
color: # FFF;
text-decoration: none;
}

]]> </ b: skin>

10. Simpan templatenya
Untuk yang kalimat simpan tidak terlihat, hilangkan dulu kotak pencariannya
11. Akses Elemen Situs >> Tambah Gadget

12. Copy kode berikut

<a href="http://tutorialseo-blog.blogspot.com/ "class="navigation"> Home </ a>
<a href="http://tutorialseo-blog.blogspot.com/search/label/aksesoris%20blog "class="navigation"> Aksesoris </ a>
<a href="http://tutorialseo-blog.blogspot.com/search/label/dasar%20blog" class="navigation"> Dasar-dasar Blog </ a>
<a href="http://tutorialseo-blog.blogspot.com/search/label/gadget "class="navigation"> Gadget </ a>
13. Simpan

Selesai deh, lihat hasilnya ....




Masukkan alamat email kamu disini:

Posting Keren Lainnya : Bloggeron

0 komentar:

:f :D :x B-) b-( :@ x( :? ;;) :-B :| :)) :(( =(( :s :-j :-p :-o :-g :-x

Poskan Komentar

Diberdayakan oleh Blogger.

Recent Posts With Thumbnails v3

Recent Posts With Thumbnails v3