NamaIconHeader MEMBUAT CATMENU HEADER

gataw kenapa disebut catmenu
kaya nya mirip kucing kalee yah...?? xixixixi
ini dia samplenya
Superb CSS Menu For Bloggers
mau tahu cara buatnya??


langkah pertama cari kode ]]></b:skin>
kemudian paste kode dibawah ini tepat dibawah kode ]]></b:skin>


#catmenucontainer{
height:33px;
width:1000px;
margin:0 auto;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEid3z_Xp4xNUWCIE-FXst02XrO7JfRCp_prU5TV1PrNoC0jT2oq5u-SPqwRmajxjKrf259a71H5NAnlx8MBdOJl6_uoLDHt8ZEvObErkLjcpaZ7ccOlW6_QgD7yNdGQ4IsULZ2xufCjQ3h0/) repeat-x;
display:block;
padding:0px 0 0px 0px;
font-size:12px;
font-family:"Segoe UI",Calibri,"Myriad Pro",Myriad,"Trebuchet MS",Helvetica,Arial,sans-serif;
font-weight:normal;
border-top:1px solid #252424;
}


#catmenu{
margin: 0px;
padding: 0px;
width:1000px;
background:#252525 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEid3z_Xp4xNUWCIE-FXst02XrO7JfRCp_prU5TV1PrNoC0jT2oq5u-SPqwRmajxjKrf259a71H5NAnlx8MBdOJl6_uoLDHt8ZEvObErkLjcpaZ7ccOlW6_QgD7yNdGQ4IsULZ2xufCjQ3h0/) repeat-x;
height:33px;
}


#catmenu ul {
float: left;
list-style: none;
margin: 0px;
padding: 0px;
}


#catmenu li {
float: left;
list-style: none;
margin: 0px;
padding: 0px;
}


#catmenu li a, #catmenu li a:link, #catmenu li a:visited {
color: #fae7df;
display: block;
margin: 0px;
padding: 9px 10px 10px 10px;
}


#catmenu li a:hover, #catmenu li a:active {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUCFns0aHdUrALIoYI-dTG_F5fXgqCF_nWisj_0eOj2XFrf6WA_7c7v62kRUQV8DV86s-5Ctj4Znt_D07uMTAfT7soqijY6Gc8awfFZMc_I2HTLipsaSRTJQWta7sWPoBAe5u0mH__HV5G/) repeat-x;
color: #fff;
margin: 0px;
padding: 9px 10px 10px 10px;
text-decoration: none;
}


#catmenu li li a, #catmenu li li a:link, #catmenu li li a:visited {
background:#ED4A05;
width: 150px;
color: #fae7df;
font-family:Tahoma,century gothic,Georgia, sans-serif;
font-weight: normal;
float: none;
margin: 0px;
padding: 9px 10px 10px 10px;
border-bottom: 1px solid #FF7800;


}


#catmenu li li a:hover, #catmenu li li a:active {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUCFns0aHdUrALIoYI-dTG_F5fXgqCF_nWisj_0eOj2XFrf6WA_7c7v62kRUQV8DV86s-5Ctj4Znt_D07uMTAfT7soqijY6Gc8awfFZMc_I2HTLipsaSRTJQWta7sWPoBAe5u0mH__HV5G/) repeat-x;
color: #fff;
padding: 9px 10px 10px 10px;
}


#catmenu li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 170px;
margin: 0px;
padding: 0px;
}


#catmenu li li {
}


#catmenu li ul a {
width: 140px;
}


#catmenu li ul a:hover, #catmenu li ul a:active {
}


#catmenu li ul ul {
margin: -34px 0 0 170px;
}


#catmenu li:hover ul ul, #catmenu li:hover ul ul ul,
#catmenu li.sfhover ul ul, #catmenu li.sfhover ul ul ul {
left: -999em;
}


#catmenu li:hover ul, #catmenu li li:hover ul,
#catmenu li li li:hover ul, #catmenu li.sfhover ul,
#catmenu li li.sfhover ul, #catmenu li li li.sfhover ul {
left: auto;
}


#catmenu li:hover, #catmenu li.sfhover {
position: static;
}


step kedua carilah kode <div id='content-wrapper'>
Setelah itu copy kode dibawah ini dan paste tepat dibawah kode <div id='content-wrapper'>
<div id='catmenucontainer'>
<div id='catmenu'>

<ul>
<li><a href='http://NAMA LINK BLOG ANDA/'>Home</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-1</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-1-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-1-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-1-3</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2-3</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-3</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-3-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-3-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-3-3</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-4</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5-3</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5-4</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-6</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-6-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-6-2</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-7</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-8</a></li>
</ul>

<div style='float:right;margin-right:20px;'>
<a href='http://feedburner.google.com/fb/a/mailverify?uri=pbtemplates'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1HyuTFc6Oj0YxowFy3PHyS9OsfTuTMJAuTMVp4m7q5JOkBJeYAVPqOzIP06F7RKR5RUloKQzujVYaPmEdVMbMVtbYJsFOODah-BQ_X2Ucyy-4RrWo3_yKzvPSYKw8Q8KUdE_HkZ5dC-a4/'/></a>
<a href='http://feeds.feedburner.com/pbtemplates'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMM_n8rFul0zsHKBv8xWNj2KA8S-BQ3i3HWGqCrBei_J2bgYSznuibY1xyH_S1h8-gpJqxD9pmDwP60H-3OmwihPGJTciDomhDo1a4LhiWt-jZw6NSom0QshNGs1QMTze8Tr6PugGP394R/'/></a>
<a href='http://www.twitter.com/btipandtrick'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirtB6Pagyfasz8uX55NZvy7Y-tMbywwS_tMzLJXpJttc2Jwi3KBMHXIx2cK3URDZaWYP9If_yEVg0azLH3eho9ouJyabnmgHRT0NP-DylSGnRJFt3JqR4A2tGJPA14Owb5wbU-Fy875Kr7/'/></a>
<a href='mailto:123@abc.com'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixRejYlAykwomJeKspecAaNunQQI4cyHi4exEXcmEV2mL-pK_Pfy9aAb_wKABjrwpV4BuWuv9htMXahOW_P7LDmkYCuuKSg3SATN6S1dSzYH6PKPtH4Mh7LyQvUo1MaLTJinxf9JUiT92A/'/></a>
</div>

</div>
</div>

<div class='clear'/>


catatan
warning banget sebelum nyoba ngedit template anda
terlebih dahulu backup template anda takut terjadi eror aja...xixixixixi
untuk background bisa anda modifikasi sesuai selera dengan mengganti kode yang berwarna hijau
untuk sub menu atau yang memanjang kebawah juga bisa anda tambahkan sesuai selera dengan mengganti kode yang berwarna orange
mudah khan???
selamat mencoba


Baca Yang ini Juga Ya... :



4 comments:

EFA May 11, 2010 at 12:09 AM  

error!!!! mayb ur coding is problem?

Berbagi ilmu August 26, 2010 at 2:48 AM  

ko gagal ci knpa y,..
tolong pencerahannya non,..

WWW.ahmadsyahbio.tk September 4, 2010 at 11:56 PM  

Waduh kalo ditemplate saya ngak jalan malah error....gimanaya..?

Post a Comment

BUKU TAMU DAN ATRIBUT BLOG

Please Comment
Posting Populer
[..::::A::::..]
  • about Healty
  • ALL ABOUT LOVE
  • Aktivitas Sandal Jepit
  • Amru Site
  • AnjingGoblog
  • Attayaya Dot Net
  • Andalas Van Java
  • Aneh81
  • Aneh,Unik,Lucu
  • All In "tUmbuH"
  • Archv3nture
  • Anita Atax
  • Anak kolonX
  • Acatrazz Blogspot
  • Aldien Blog
  • Athene Blog
  • Andy Wong ECAkNYO
  • Aanworld Bloger Pemalang
  • Ayu Adine
  • About Finance
  • [..::::B::::..]
  • BAYU LEBOND
  • Bebens007
  • Bayu Saputra
  • Blog Kang Rohman
  • Blog Putra Jepang
  • Blogger Directories
  • Belajar Bisnis Internet
  • BIBIR SAKTI MASBEKEN
  • BLOGING VIA HP
  • Blog persahabatan
  • Bull^Bull & Coretannya
  • Blogging-Surfer
  • Blogging Bucks
  • BUNGLONBLOG
  • BOOK ONLINE
  • [..::::C::::..]
  • Coretan Si8ball Pekox's
  • Choe Link 2009
  • Celebes City
  • Computer Tips Tricks
  • Catatan Putra
  • [..::::D::::..]
  • Dunia Komputer
  • Dodi Odhievara Blog
  • DEDICATED COMPUTER SERVER
  • Dian Ambar Wasesha
  • Dhana Arsega
  • DARA WEBSITE
  • DEVIL COMPUTER
  • [..::::E::::..]
  • EFMED 2001
  • Elyas Anak Merana
  • EXOTICA
  • [..::::F::::..]
  • Fatur RumaH Curhat
  • FIGHT FOR WOMEN HEALTH
  • Forum Komunitas
  • Full Software Collextions
  • Fajar Pekox's
  • [..::::G::::..]
  • Gak Mutu Blog
  • Gustihana Blog
  • Ginanjar Kluwut
  • [..::::H::::..]
  • Harry Nuriman
  • Huyuh Blog
  • [..::::I::::..]
  • Indonesia Ku
  • Indo15 Blog
  • Ijo Punk Jutee
  • [..::::J::::..]
  • Jasa Pembuatan Blog
  • [..::::K::::..]
  • Keboo Kyut BC
  • KLUWAN dot COM
  • KLUWAN LOVE IS BEAUTY
  • KLUWAN backtrack
  • Kang Asep Blog
  • kakve-santi (Pr. 4)
  • Kartika Putri Pratama
  • KokoBotax
  • KelireirenG
  • KompiKita
  • K-Bejo
  • Komunitas Oedjoeng
  • [..::::L::::..]
  • Lia Amalia
  • [..::::M::::..]
  • Monika Hansen
  • Manfaat Bersama
  • Malindo fm
  • Mhz Maheswari Vania Yoga
  • [..::::N::::..]
  • Nurina Utami
  • Natha Lia Blog
  • Ngeposting ni yee
  • [..::::O::::..]
  • Oklubi Dot Com/
  • Oyah Saloon
  • Okygaul85
  • [..::::P::::..]
  • PakiesDjangan
  • Phonank bukan Ohang
  • Poter Punya
  • Paradise
  • Poeds On Girimukti
  • priagoenks.co.cc/
  • Psikonseling Evi Yulianti
  • Putra Blog
  • [..::::Q::::..]
  • ...
  • [..::::R::::..]
  • RUANGSC COMUNITY
  • RAHMAT TEA
  • RAKSAKA NALA
  • Rock Klasik tetep Asyik
  • rahad2six
  • Rizky2009
  • Rahmei Yuda
  • Rachmatea
  • Rizal Blog
  • Rival Aditya
  • Ririn Keyliana Blog
  • Ruang Hati
  • [..::::S::::..]
  • SATRIYO HP
  • SANG KHALIFAH
  • SOUND BLASTER
  • Saung Urip
  • Sulthan Yususf
  • Samsulmuna
  • Surakarta Entrepreneur
  • shirieen
  • Seputar Dunia Anak
  • SehatZBlog
  • Sugeng Pribadi DOT COM
  • Satrianews Dot Net
  • Satriacell Dot Com
  • Sebuah Berita
  • SOMBLERO
  • [..::::T::::..]
  • Toko Tas OnlinE
  • Tovarossi
  • Terminal LPG Semarang
  • Tourism of Indonesian
  • The JaeV
  • TIPS KELUARGA
  • Taekwondo Indonesia
  • Tech Info
  • Tubir Bloger
  • [..::::U::::..]
  • ....
  • [..::::V::::..]
  • vanmovic'S blog
  • VIPERX
  • Vienka Dot Com
  • [..::::W::::..]
  • Worldsenterprise
  • Witul4r BC
  • [..::::X::::..]
  • .....
  • [..::::Y::::..]
  • Yoga Kucing
  • Yahya Blog
  • [..::::Z::::..]
  • .....
  •   © Blogger template Webnolia by Ourblogtemplates.com 2009

    Back to TOP