Caranya :
1. Anda Ketik alamat www.blogger.com
2. Login pada blogger
Masukkan nama email anda dan passwordnya. Selanjutnya klik MASUK.
3. masuk ke halaman Template
4. Edit HTML lalu Lanjutkan
5. Klik centang pada Expand Template Widget
6. Cari kode dengan menggunakan (F3)
7. Pasang kode di bawah ini di atas kode ]]></b:skin>
8. Atau terserah teruh dimana aja. Misalkan taruh di :
1. </header>
2. <b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
3. </header>
<div class='tabs-outer'>
|
Copy CSS di bawah ini :
<style>
/* -- Menu Horizontal + Sub Menu-- */
#cat-nav {background:#1a39d6;margin:0 170px;padding:0;height:45px;}
#cat-nav a { color:#dffa0f; text-decoration:none; text-shadow: #033148 0px 0px 0px;border-center:15px solid #156994;}
#cat-nav a:hover { color:#ffffff; }
#cat-nav li:hover { background:#000; }
#cat-nav a span { font-family:Verdana, Geneva, sans-serif; font-size:12px; font-style:normal; font-weight:400; color:#fff; text-shadow:none;}
#cat-nav .nav-description { display:block; }
#cat-nav a:hover span { color:#fff; }
#secnav, #secnav ul { position:relative; z-index:100; margin:0; padding:0; list-style:none; line-height:1; background:#1a39d6; }
#secnav a { font-family:Georgia, "Times New Roman", Times, serif; font-style:bold; font-weight:700; font-size:14px; display:block; z-index:100; padding:0 15px; line-height:35px; text-decoration:none;}
#secnav li { float:left; width: auto; height:35px;}
#secnav li ul { position: absolute; left: -999em; width: 110px; top:35px}
#secnav li ul li { height:30px; width: 110px; border-top:1px solid #ffffff; }
#secnav li ul li a { font-family:Verdana, Geneva, sans-serif; width:180px; line-height:30px; padding:0 10px; font-size:11px; font-style:normal; font-weight:400; color:#eee; }
#secnav li ul ul { margin: -30px 0 0 180px; }
#secnav li:hover ul ul, #secnav li:hover ul ul ul, #secnav li.sfhover ul ul, #secnav li.sfhover ul ul ul { left:-999em; }
#secnav li:hover ul, #secnav li li:hover ul, #secnav li li li:hover ul, #secnav li.sfhover ul, #secnav li li.sfhover ul, #secnav li li li.sfhover ul { left: auto; }
#secnav li:hover,#secnav li.hover { position:static; }
#cat-nav #secnav {width:100%;margin:0 auto;}
</style>
<div id='cat-nav'>
<ul class='fl' id='secnav'>
<li><a href='arievoneheart.blogspot.com'><img src='URL icon yang anda inginkan'/></a></li>
<li><a href='URL anda' title='Nama Menu Bar'><img src='URL icon yang anda inginkan'/></a></li>
<li><a href='URL anda' title='Nama Menu Bar'><img src='URL icon yang anda inginkan'a></li>
<li><a href='URL anda' title='Nama Menu Bar'><img src='URL icon yang anda inginkan'/></a></li>
<li><a href='URL anda' title='Nama Menu Bar'><img src='URL icon yang anda inginkan'a></li>
<li><a href='URL anda' title='Nama Menu Bar'><img src='URL icon yang anda inginkan'/></a></li>
<li><a href='URL anda' title='Nama Menu Bar'><img src='URL icon yang anda inginkan'/></a></li>
<li><a href='URL anda' title='Nama Menu Bar'><img src='URL icon yang anda inginkan'/></a></li>
<li><a href='arievoneheart.blogspot.com' title='Nama Menu Bar'><img src='URL icon yang anda inginkan'/></a>
<ul id='sub-custom-nav'>
<li><a href='URL anda' title='Depkripsi Judul'>Nama Judul Tujuan</a></li>
<li><a href='URL anda' title='Depkripsi Judul'>Nama Judul Tujuan</a></li>
<li><a href='URL anda' title='Depkripsi Judul'>Nama Judul Tujuan</a></li>
</ul>
</li>
<li><a href='arievoneheart.blogspot.com' title='FRIEND BLOG'><img src='URL icon yang anda inginkan'/></a>
<ul id='sub-custom-nav'>
<li><a href='URL anda'>Nama Judul Tujuan</a></li>
<li><a href='URL anda'>Nama Judul Tujuan</a></li>
<li><a href='URL anda'>Nama Judul Tujuan</a></li>
</ul>
</li>
<li><a href='URL anda' title='Depkripsi Judul'><img src='URL icon yang anda inginkan'/></a></li>
</ul>
</div>
|
9. Paste di HTML anda.
dan lihat hasilnya.
KETERANGAN :
Merah : Isi dengan blog ANDA. Misalkan : braddlestone.blogspot.com
Biru : Isi URL / alamat website yang anda inginkan. Misalkan, : http://www.facebook.com/
Hijau : Isi Judul MENU BAR.
Puith : Isi Judul tujuan alamat website. Misalkan : TWITTER
Kuning : Isi dengan URL icon. Misalkan :
http://img14.picoodle.com/i5ch/muhammadimamnurrahman/15xw_f92_ud3b2.jpg
NB : Jika tidak mempunyai URL icon, anda bisa kunjungi di SINI!
Kalau anda ingin mengembalikan ke tahap awal, anda bisa Kembalikan templat widget ke default
Maka akan kembali seperti semula tampilan blog sobat.
Sekian informasi dariku, semoga dapat bermanfaat bagi anda