Hai sob.. Sobat ingin tampilan blog sobat lebih keren dan pastinya pengunjung sobat tertarik dengan blog sobat?
nah, kali ini saya akan beri tips buat sobat tentang bagaimana cara membuat menu di atas header blog.
nah, dengan header itu pengunjung blog sobat dapat memilih bagian mana yang sekiranya ada bacaan yang menarik untuk dibaca.
Langsung aja ya sob ke TKP !!!
Pertama :
sobat log in dulu di blog
Kedua :
sobat masuk ke menu templates => edit HTML kemudian centang expand yang ada di kiri atas.
Ketiga :
sobat cari kode ]]></b:skin> (mudahnya tekan tombol kombinasi CTRL+F, kemudian cari kode tadi)
Keempat :
sobat letakkan script berikut di atas kode itu.
/*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;
}
Kelima :
sekarang sobat cari kode </head>
Keenam :
silakan letakkan script berikut di bawah kode tadi
<div id='top'>
<div id='top-wrap'>
<div class='topnav'>
<ul id='topnav'>
<li><a href='url / link homepage '>home</a></li>
<li><a href='url / link 1'>judul link</a></li>
<li><a href='url / link 2'>judul link</a></li>
<li><a href='url / link 3'>judul link</a></li>
<li><a href='url / link 4'>judul link</a></li>
</ul>
</div>
</div>
<div style='clear: both;'/>
</div>
Ketujuh :
ganti kode url / link 1' dengan url link yang ingin sobat jadikan menu. dan ganti judul link dengan judul lonk yang sobat inginkan. Contohnya : Link exchange.
seperti ini sob salah satu contohnya
<li><a href='http://fajarwahyuutama.blogspot.com/2012/10/ayo-bertukar-link.html'>Link Exchange</a></li>
Kedelapan :
silakan simpan.
Jadi deh..
Cara membuat menu di atas header blog ini sebenarnya mudah kalau sobat mau berusaha.
Nah, silakan mencoba ya sobat...
good luck! semoga tips yang saya berikan selalu bermanfaat buat sobat.
terimakasih ^_^
bagus juga sob, sepertinya kapan2 harus dicoba. nih ..nuhun
hehe, oke bang.. selamat mencoba ya. semoga berhasil deh. makasih ya udah mampir :)
maksudnya gimana to jar????
@ahmadi tanjung.. makasih sob udh mampir. mampir lgi sob. gausah ragu" :D
@Fariz Fajar : cermati dlu sob kata demi kata.
hub.i sya d sklh jika ad wktu :)
Makacih ya mas brooo
kunjungin blog saya sob!
http://gudang2share.blogspot.com
@bang Barizi : oke mas bro!! sama-sama udah mampir di blog ane :D
@Hidayat F : oke bang! siap meluncur nih :D
Keren mas brow.Saat gua masukin alamt blog gua kok disuruh login ke email dulu.gimana ya brow??maaf newbi
http://down-dc-seven.blogspot.com/
@SDN 3 Sumberejo : itu disuruh konfirm di e-mail amda dulu sob.. coba buka inbox e-mail sobat. jika ada perintah untuk mengkonfirmasi klik aja peritah itu sob :)
@Zale, oke sob.. kunjubngan balik :D
udah nyoba, kren kawan
@M Basri : oke bang.. semoga bermanfaat ya :D
makasih udah mampir :)
cakep sob...
=============================
visit cirebon4rt.blogspot.com
wah sob.... q coba kok kagak bisa ya sob?
ngalimahfud.blogspot.com
mantab gan,, tapi dah coba kok jadinya menurun yawh???? kok g bisa ke samping
maaf sob itu jadinya, vertikal, bukan horizontal kayak punya ente..
@Warok : maksd ente gimana ya? hehe.. nyatanya punya saya jadi :)
@pawi roys : hehe iya sob mkasih atas kritiknya itu bisa membuat saya lebih teliti kedepannya :)
bagus tuh info nya ! makasih banyak ya gan.
hehe.. oke bang samasama ya semga bermanfaat :)
Gaul totornya gan, ngebantu untuk revisi blog gue www.tulisanwortel.com. Thank's ya gan, kalo ada waktu mampir di blog gue juga ya.
MANTAP,,,thanks tips yang bagus ini gan...