Cara Membuat Navbar Stripe-Ad Di Blogger ~ Tips dan Trik Ngeblog

Assalamu'alaikum, bagaimana kabarnya sob, pada sehatkan ?, sob, pada kali ini saya akan membagikan sebuah trik Cara Membuat Navbar Stripe-Ad Di Blogger, kalau belum tau apa itu Navbar Stripe-Ad, coba kamu lihat dibagian atas blog ini, nah itu yang dinamakan Navbar Stripe-Ad, Navbar Stripe-Ad ini juga banyak digunakan banyak blogger seperti o-om.com, ok bila sudah tau apa itu Navbar Stripe-Ad, sekarang kita coba bersama, selamat menyimak (wah formal sekali).

1.Pada dashbor blogger anda, anda klik template.

2.Bila sudah klik Edit HTML >> Proceed.

3.Sekarang kamu cari kode ]]></b:skin>, cara cepatnya tekan tombol Ctrl+F, ketik ]]></b:skin> pada kolom yang muncul.

4.Ok, langkah selanjutnya kamu masukkan kode dibawah ini diatas kode ]]></b:skin>

/*-- (mta bar) --*/
#mta_bar{background:#444 url('http://4.bp.blogspot.com/_C6KkooKXCEw/TIChde9sutI/AAAAAAAAGzk/5DJ4Cbds91E/s200/topnavbar-c.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:8px; padding-bottom:6px}
* html #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:Verdana,Arial; font-size:12px; font-weight:normal; font-style:normal; color:#fff; width:55%}
#mta_bar .left{float:left; text-align:left; font-family:Verdana,Arial; font-size:12px; font-weight:normal; font-style:normal; color:#fff; width:30%}
#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/TIBf3E-mUfI/AAAAAAAAGwM/EoxAFDlcdr4/s200/feed-c.png') no-repeat; font-weight:bold;text-decoration:none; color:#fff; padding-left:23px; padding-right:0; padding-top:0; padding-bottom:10px}
#left_bar a:hover{text-decoration:underline; color:#fff}
#left_bar2 a{background: url(http://2.bp.blogspot.com/_C6KkooKXCEw/TICuIqKZqRI/AAAAAAAAG0E/hfkQzQz7h20/s200/check-c.png) no-repeat 2px; text-decoration:none; font-weight:bold; color:#fff; padding-left:21px; padding-right:0; padding-top:0; padding-bottom:0px}
.small-comment{
 background:url(http://4.bp.blogspot.com/_C6KkooKXCEw/TICilRvoM4I/AAAAAAAAGzs/F1VwCZc7uzY/s200/smallcommentsx-c.png) no-repeat;
 padding-left:8px;
 height:20px;
 line-height:14px;
 float:right;
 color:#FFF;
 font-weight:bold;
 font-size:11px;
 margin-top:3px;
 margin-left:10px;
}.small-comment div{
 background:url(http://4.bp.blogspot.com/_C6KkooKXCEw/TICilRvoM4I/AAAAAAAAGzs/F1VwCZc7uzY/s200/smallcommentsx-c.png) top right no-repeat;
 padding-right:8px;
 height:20px;
}
#left_bar2 a:hover{text-decoration:underline; color:#fff}
#left_bar3 a{background: url(http://3.bp.blogspot.com/_C6KkooKXCEw/TIBf2gtK0UI/AAAAAAAAGwE/Wml7-gPP17U/s200/facebook-c.png) no-repeat 2px; text-decoration:none; color:#fff; padding-left:21px; padding-right:0; padding-top:0; padding-bottom:0}
.feed-small-right-feed,.small-right{font-size:11px;float:right;font-weight:700;background:url(http://1.bp.blogspot.com/_C6KkooKXCEw/TIBf3E-mUfI/AAAAAAAAGwM/EoxAFDlcdr4/s200/feed-c.png) right 0 no-repeat;padding-right:20px;padding-bottom:15px}
#crosscol-wrapper{margin:0 20px;padding:10px 0 0}
#jarak_atas {width:2px;height:20px;}

5.Sekarang kamu masukkan kode dibawah ini diatas </head>

6.Bila sudah kamu masukkan kode berikut ini dibawah kode <body>

7.Nah sekarang sudah diujung trik Cara Membuat Navbar Stripe-Ad, apa ayo, yah save template anda lah.

Catatan:

Kamu ganti link-link dibawah ini dengan link punya kamu sendiri ya.

Link Facebook : http://www.facebook.com/muhammadabuabdillah
Link Twitter : http://twitter.com/#!/muhammadok
Feed : http://feeds.feedburner.com/TipsDanTrikNgeblog

Kamu juga ganti tulisan seperti dibawah ini dengan punya kamu sendiri.

Gratis Berlangganan artikel dari blogmuhammad via mail, join sekarang!

Ok, sampai disini dulu semoga trik Navbar Stripe-Ad ini bermanfaat untuk blog kamu, Amiin.

Link : Auto Hide pada Navbar Blog

Tips dan Trik Ngeblog

19.11.11

Cara Membuat Navbar Stripe-Ad Di Blogger

0 Komentar:

Posting Komentar

Popular Posts

Categories