Membuat Menu Horizontal Keren

Malam yang panas kipas lagi rusak tidur gak bisa, wkwkwkwkwkwkwkwkwkwk,... Itukan derita loh. Kita cerita dulu Ok, kemarin saya pernah diajarkan oleh dosen saya membuat web dengan menggunakan CSS setelah saya tes di blog ternya bisa membuat menu dengan menggunakan CSS. Ok sekarang kita membuat menu horizontal diblogger dengan menggunakan CSS silakan lihat contoh dibawah ini:



Begini cara2xnya :
1. Login dulu ke blogger kalian
2. Klik Rancangan --> Edit HTML
3. Kasih Conteng di Expand Template Widget (bilah terjadi kesalahan)
4. Tekan Ctrl+F Copy kode ini ]]></b:skin> letakan di Find tekan Enter
5. Setelah ketemu Copy code di bawah ini, letakan di atas ]]></b:skin>

#navlist ul{
margin-left: 0;
padding-left: 0;
white-space: nowrap;
}

#navlist li{
display: inline;
list-style-type: none;
}

#navlist a { padding: 3px 10px; }

#navlist a:link, #navlist a:visited{
color: #006600;
background-color: #000000;
text-decoration: none;
border: 1px solid #006600;
}

#navlist a:hover{
color: #000000;
background-color: #006600;
}

6. Simpan Template
7. Setelah itu klik Elemen Laman --> Tambah Gadget --> HTML/JavaScrip
8. Copy code di bawah ini dan letakan di dalamnya

<div id="menu_keren">
<ul id="navlist">
<li><a href="#">Home</a></li>
<li><a href="#">Galery</a></li>
<li><a href="#">About Us</a></li>
<li><a href="#">Contack Us</a></li>
<li><a href="#">Request</a></li>
</ul>
</div>

9. Yang tanda "#" ganti dengan URL anda
10. Simpan Template dan lihat hasilnya

Selamat beraktifitas dan berkarya ?...

Apa ini yang anda cari ?

11 comments:

ie-dam mengatakan... [Reply]

knp tdk bisa makai link lain....

Klopototolia TJ mengatakan... [Reply]

@ie-dam : Bisa kok mas, ganti aja yg pagar "#" dengan alamat URL anda,...

Aldie Maulana mengatakan... [Reply]

mas bisa ga modelnya disamain sma model template di blog kitanya .

Unknown mengatakan... [Reply]

terimakasih...
keren nih..

Satu Nama mengatakan... [Reply]

Trims sob, q coba ya...!!!!!

EtGpe15_ mengatakan... [Reply]

Mantap banget gan!!

Hasriadi mengatakan... [Reply]

goood

Zainal Blogs mengatakan... [Reply]

gan kalau bisa tolong bagaimana membuat menu horizontal profesional mirip website resmi
terima kasih

Klopototolia TJ mengatakan... [Reply]

@a.zainal61 : maaf yah gan, saya tidak tau yg namanya web profesional saya hanya seorang pemblogger biasa...
kalau membuat menu horizontal di blog cssnya diletakan di atas "b:skin" sedangkan diweb html itu meletakan cssnya diatas "body", susah mas kalau di jelaskan, nati malahan salah lagi :'(

Unknown mengatakan... [Reply]

siiipppp booossss

Unknown mengatakan... [Reply]

cara membuat menu yang ada tulisannya Software Free Tools, Hacking ,Trick Blogger, Lain-lain itu gmna gan,q tunggu balasanya dari agan,mksih soalnya sya msih nuwbie

Tinggalkan Komentar Anda di Bawah ini!!!

Kalau ada Artikelnya yang kurang jelas, tuliskan komentar anda dibawah ini!!! Tapi yang sopan yah demi menjaga kenyamanan bersama, Anda Sopan Kami Segan!!! untuk komentar SPAM akan saya hapus!!!

 

© 2010 Klopototolia TJ. Powered By : Blogger

ping fast  my blog, website, or RSS feed for Free Ping your blog, website, or RSS feed for Free