Cara Membuat Stripe Bar di Blog

Stripe Bar bentuknya hampir sama dengan default navigation bar pada blogger. Stripe Bar di blog kita dapat kita manfaatkan untuk meletakkan link iklan, informasi, Feed dan informasi lainnya sesuai keinginan, yang jelas dengan Stripe Bar, isi dari Stripe Bar itu sendiri dapat dengan mudah dilihat oleh pengunjung. Dilengkapi dengan icon Close, Stripe Bar ini dapat ditutup jika dirasa mengganggu oleh pengunjung blog.

Cara pasang Stripe Bar untuk Blogger  >>>

1. Silakan Login ke account Blogger anda

2. Masuk ke Tab Rancangan >>> Edit HTML

3. Cari (CTRL + F) kode ]]></b:skin> kemudian letakkan script CSS berikut diatas kode ]]></b:skin>

#mta_bar { background:#FFFFE1 url('http://4.bp.blogspot.com/_C6KkooKXCEw/SQnz2n2y02I/AAAAAAAACiU/hgebwIqZY9c/s400/wow.gif?imgmax=800') repeat-x; border-bottom: 1px solid #808080; margin: 0 0 3px 0; padding: 4px 0; z-index: 100; top: 0; left: 0; width: 100%; overflow: auto; position: fixed; }* html #mta_bar{ /*IE6 hack*/
position: absolute; width: expression(document.compatMode=="CSS1Compat"? document.documentElement.clientWidth+"px" : body.clientWidth+"px"); } #mta_bar .center{float:left; text-align:center; font-family:Verdana,Arial; font-size:13px; font-weight:bold; font-style:normal; color:#fff; width:65%}
#mta_bar .left{float:left; text-align:left; font-family:Verdana,Arial; font-size:13px; font-weight:normal; font-style:normal; color:#fff; width:20%}
#mta_bar .right{font-family:verdana,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:underline}
#mta_bar .right a:hover{font-size:10px; color:#fff; text-decoration:none}
#left_bar a{background:url('http://1.bp.blogspot.com/_C6KkooKXCEw/SPyUclWEsEI/AAAAAAAAChM/e6wa1ef3jTQ/s400/stripead-feed.gif') no-repeat; text-decoration:none; color:#fff; padding-left:23px; padding-right:0; padding-top:0; padding-bottom:0}
#left_bar a:hover{text-decoration:underline; color:#fff}
#left_bar a:hover { text-decoration: underline; color: #0000FF; }

4. Selanjutnya masukkan kode berikut sebelum kode </head>

<script src='http://grandisk.xtgem.com/stripe-blog-triks.js' type='text/javascript'/>

5. Selanjutnya, Letakkan kode HTML berikut sebelum kode </body>

<div id='mta_bar'>
<div id='left_bar'><span class='center'><a href='http://www.pandhawa-tiga.blogspot.com/feeds/posts/default'>Dapatkan Info Menarik Dunia Blogging Disini !!!
</a></span> </div>

<span class='right' onmouseout='self.status=&apos;&apos;' onmouseover='self.status=&apos;blog-triks.blogspot.com&apos;;return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='http://2.bp.blogspot.com/_C6KkooKXCEw/Si0hpItyl-I/AAAAAAAAEYQ/kmsk9iVM9HM/s400/delete.png' style='cursor:hand;cursor:pointer;'/></span></div>

Kode yang tercetak berwarna merah, bisa anda ganti dengan teks, kode HTML, atau banner yang anda inginkan.

6. Dan Terakhir, "Save Template"