Twitter Facebook Google Plus RSS Feed Email

Cara Membuat Menu di Bawah Header pada Blogspot



Tahap I >>>
1. Login di blogger dengan ID blog sobat
2. Klik menu Layout
3. Klik Tab Edit HTML
4.Cari kode dibawah ini, untuk mempermudah pencarian silahkan gunakan CTRL+F

<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'>
<b:widget id='HTML1' locked='false' title='' type='HTML'/>
</b:section>
</div>

Ubah kode showaddelement='no' menjadi showaddelement='yes' 

5.Simpan


Tahap II >>>
1.Klik Page elements
2.Pilih Elemen Laman
3.Klik Tambah Gadget > HTML/Javascript
4.Copy kode dibawah ini,simpan dan letakan tepat dibawah header.

<a href="#" class="navigation">HOME</a>
<a href= "#" class="navigation">CONTACT</a>
<a href= "#" class="navigation">BUKU TAMU</a>
<a href= "#" class="navigation">FACEBOOK</a>
<a href= "#" class="navigation">TWITER</a>
<a href= "#" class="navigation">DOWNLOAD</a>
<a href= "#" class="navigation">LAIN-LAIN</a>
<a href= "#" class="navigation">CHATTING</a>

*Warna Biru Untuk Alamat URL yang dituju
*Warna Pink Untuk Nama Tulisan yang akan tampil

Tahap III >>>
1.Klik Tata Letak
2.Klik Edit HTML
3.Cari kode </b:skin> dengan menggunakan tombol CTRL+F
4.Copy kode dibawah ini dan letakan tepat diatas kode </b:skin>

a.navigation {
background: #3333ff ;
color: #ffffff;

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

*Warna Orange bisa disesuaikan selera


5.Simpan


Comments
0 Comments

Tidak ada komentar:

Posting Komentar