Cara Membuat Header Bar | Tips blogger - Coba perhatikan header bar nya blog o-om,remo-xp.Apakah anda ingin membuatnya ? Anda memasuki wilayah yang sangat tepat. Langsung saja saya berikan caranya.
1. Login dulu ke blog anda, Masuk ke Rancangan > Edit HTML.
2. Pertama kita akan memasukan kode CSS nya, perhatikan kode di bawah ini. Lalu letakkan tepat di atas : ]]></b:skin>.
/*-- (mta bar) --*/3. Anda simpan dulu juga boleh, Lalu Cari kode di ini : <body>. Jika sudah, letakkan kode di bawah ini tepat di bawah kode tersebut.
#mta_bar{background:#444 url('http://i726.photobucket.com/albums/ww267/asrizalwahdanwilsa/C-OM%20Blogz/wow.png') repeat-x; border-bottom:1px solid #111; z-index:100; top:0; left:0; width:100%; overflow:auto; position:fixed; margin-left:0; margin-right:0; margin-top:0; margin-bottom:4px; padding-left:0; padding-right:0; padding-top:7px; padding-bottom:4px;
z-index:10000;opacity: 0.9;filter: alpha(opacity: 90);}
#mta_bar{position:absolute; /*IE6 hack*/width:expression(document.compatMode=="CSS1Compat"? document.documentElement.clientWidth+"px":body.clientWidth+"px")}
#mta_bar .center{float:left; text-align:center; font-family:Arial; font-size:12px; font-style:normal; color:#FFF; width:65%}
#mta_bar .left{float:left; text-align:left; font-family:Arial; font-size:12px; font-weight:normal; font-style:normal; color:#FFF; width:20%}
#mta_bar .right{font-family:Arial,Helvetica,sans-serif; float:right; text-align:center; font-weight:normal; font-size:10px; letter-spacing:0; width:30px; white-space:nowrap}
#mta_bar .right a{font-size:10px; color:#FFF; text-decoration:none;}
#mta_bar .right a:hover{font-size:10px; color:#FFF; text-decoration:none;}
#left_bar a{background:url('http://i726.photobucket.com/albums/ww267/asrizalwahdanwilsa/C-OM%20Blogz/stripead-feed.png') no-repeat; text-decoration:none; color:#FFF; padding-left:23px; padding-right:0; padding-top:0; padding-bottom:0}
#left_bar a:hover{color:#FFF; text-decoration:none;}
#left_bar2 a{background: url() no-repeat 2px; color:#FFF; text-decoration:none; padding-left:21px; padding-right:0; padding-top:0; padding-bottom:0}
#left_bar2 a:hover{text-decoration:underline; color:#FFF}
<div id='mta_bar'>
<div id='left_bar2'>
<span class='left'>
<a href='http://www.facebook.com/san.hanityo' target='_blank'>My Facebook</a></span></div>
<div id='left_bar'>
<span class='center'><a href='http://feeds.feedburner.com/SanBlogs' target='_blank;'>Dapatkan artikel Dari San Blogs secara gratis via mail, join here!</a></span></div>
<span class='right' onmouseout='self.status=''' onmouseover='self.status='asrizalwahdanwilsa';return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVWsyz-PH63JxbWhBofxkb32R3pCEFZ-MwTIrw0QtxAfeeb4U2Icij_rWdgWLSX2i8VzbNmTM74J-WP97csiJ_fNPssdPe7SRFiyOiBQypzmVLnPKeybYC9EiCcTIxVPcSMLMk1cDFTCpq/' style='cursor:hand;cursor:pointer;'/></span></div>
- Nb :Teks yang di beri warna merah dan di cetak tebal itu bisa anda ganti sesuka anda.