Cara Membuat Menu Diatas Top Header

Bagi para sahabat bloger yang bingung bagaimana cara membuat menu di atas header saya akan menjelaskan caranya...
ya udah gk usah bsa basi lagi cekedot langsung aja lihat langkah-langkahnya

1. Login di blogger dengan ID Cyber Mania
2. Klik menu Layout
3. Klik Tab Edit HTML




Cara Membuat Drop Cap pada Posting

Untuk berjaga-jaga jika terjadi kesalahan sebaiknya backup dulu template anda dengan mengklik Download Template Lengkap.

Cara Membuat Drop Cap pada Posting
4. Centang Expand Template Widget agar code dapat terlihat semua

5. Masukan code berikut

/*The top Menu*/
#top{
margin:auto;
padding: 0;
width: 100%;
background:#000000;
border-bottom:1px solid #373127;
}
#top-wrap{
margin:auto;
padding: 0;
width: 960px;
background:#000000;
}
#navwrap {margin: 0px auto; width:560px; float:left;background:#080705;}
.topnav ul {list-style:none;margin:0;padding:0px; float:left;}
.topnav li {float:left;margin:0;text-align:center;}
.topnav li a {font-family: georgia; font-weight:bold; font-size:10px;display:block;padding:10px 10px;color:#fff;text-decoration:none; text-transform:uppercase;}
.topnav li a {background:none; }
.topnav li a:hover, li a:focus, li a:active {text-decoration:none; background:#ffffff; color:#000000;}
/*The top Menu*/
#med{
margin:auto;
padding: 0;
width: 100%;
background:#000000;
}
#med-wrap{
margin:auto;
padding: 0;
width: 960px;
}
.mednav ul {list-style:none;margin:0;padding:0px; float:left;}
.mednav li {float:left;margin:0;text-align:center;}
.mednav li a {font-family: georgia; font-weight:bold; font-size:11px;display:block;padding:10px 10px;color:#000000;text-decoration:none; text-transform:lowercase;}
.mednav li a {background:none; }
.mednav li a:hover, li a:focus, li a:active {text-decoration:underline; color:#000000;}
#navbar-iframe {
display: none !important;
}

taruh tepat dibawah code <b:skin><![CDATA[  lalu tarik slide kebawah sedikit dan dibawah code tadi cyber mania pasti akan menemukan serangkaian code perihal deskripsi blog. nah lalu cyber mania code panjang di atas tadi tepat di bawah serangkaian code deskripsi blog.

6. lalu cyber mania cari code <body> gunakan ctrl + F untuk memudahkan pencarian.

7. Lalu cyber mania copas code berikut tepat dibawah code <body>

<div id='top'>
<div id='top-wrap'>
<div class='topnav'>
<ul id='topnav'>
<li><a href='http://www.jendelamusikindonesia.co.cc/'>Home</a></li>
<blink><li><a href='http://www.jendelamusikindonesia.co.cc/2010/09/tangga-lagu-terpopuler.html' title='Tangga Lagu'>Tangga Lagu</a></li></blink>
<li><a href='http://www.jendelamusikindonesia.co.cc/2010/09/download-mp3.html' title='Download MP3'>Download Mp3</a></li>
<li><a href='http://www.jendelamusikindonesia.co.cc/2010/09/download-full-album.html' title='Download Full Album'>Download Full Album</a> </li>
<li><a href='http://www.jendelamusikindonesia.co.cc/2010/09/aliran-musik.html' title='Aliran Musik'>Aliran Musik</a></li>
<li><a href='http://www.jendelamusikindonesia.co.cc/2010/09/old-pick.html' title='Old Pick'>Old Pick</a> </li>
<li><a href='http://www.jendelamusikindonesia.co.cc/2010/09/request-lagu.html' title='Request Lagu'>Request Lagu</a></li>        
</ul>
</div>
</div>
<div style='clear: both;'/>
</div>

yang perlu diperhatikan kata berwarna biru silahkan cyber mania ganti sesuai keinginan cyber mania.

8. Simpan dan lihat hasilnya. Selamat mencoba...

Bookmark and Share



Artikel Terkait :)

1 komentar:

  • Pink Bgt Blognya ...
    hihihi

    http://farinaandini.blogspot.com

  • Posting Komentar

     




    Pengikut

    Harbudi Manggala Putra MengucapkanTerima Kasih Atas Kunjungan Anda Di Blog Saya . Maaf Saya Hanya Manusia Biasa Yang Berusaha Untuk Menjadi Yang Terbaik