Kamis, 01 Desember 2011

Cara Membuat Navbar Stripe-Ad Di Blogger


1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Edit HTML.

3. Klik Download Template Lengkap untuk membuat salinan template. Hal ini untuk mengantisipasi jika nanti terjadi kesalahan dalam pengeditan kita dapat dengan mudah mengembalikan template ke seperti semula.

4. Cari kode ]]></b:skin>. Untuk mempercepat pencarian, silakan tekan Ctrl + F lalu masukkan kodenya.

6. Copy kode di bawah ini dan paste di atas kode tersebut.

/*-- (mta bar) --*/
#mta_bar{background:#444 url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYiAx8bp4lI0pupmeIMbDx3cFmPY6fc9Dx4KTw2r4YrphwEAlSD8fpg_6IetNsARSitjB83yZaecH3OfgWI7AfB_aU_M7Z362T0SgOfqQsXVkykNlscBeYUAtVaoV09AGKk4_HxJxeTLS7/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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeNvPFgqzqbvUnDaR-8J1SkjeHUavGpW8-JaPb0dPMzNzGo_X5BDhjZKOcAMP1pZzdBPiDq6VRlXgZ3WfW-rWc9vNbp1ADdzCGYbxguiF7O-C06p6YWdk145PvgOl2bD-w3fP3PnPRFWlm/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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfGw3NgGfY0_mjW9dwjyygdSdttYdhRvNYOS4LIedIZ894cMxt_AW3O0BeXiUgRT0g-uIUNqLcurgxA0BdnJqNtelT_XJYeBxcc_LWqIEOmwsrQrQv85oXPE-DgWnQVZGhqjS64C4TVo8p/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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzTyujDwGmMKnLe0GOwcfq7lxCSHmadFXfpfpEXgiv1_PTZjWFt5oD-CrPRAgmnyQnVjtJLe_xYT4vDQzYHGaa55kamUdOa_Ho4-Nf_-HgSs23HacupkdgllQY13vM96nfrehDRQDlxzfc/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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzTyujDwGmMKnLe0GOwcfq7lxCSHmadFXfpfpEXgiv1_PTZjWFt5oD-CrPRAgmnyQnVjtJLe_xYT4vDQzYHGaa55kamUdOa_Ho4-Nf_-HgSs23HacupkdgllQY13vM96nfrehDRQDlxzfc/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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJy7oc3_v2wCSxGC5bF66OmDrbWs8rrjgD7BM5GFpG4MT4PUGtpMskKQkwUbblctO5ZXnpZevlpB3CR0TsCB3S7xHiA0fotqT_eBFImNY2joExg_FU4nWmTGOv8mnJmEoo-yq0tpbLKYWl/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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeNvPFgqzqbvUnDaR-8J1SkjeHUavGpW8-JaPb0dPMzNzGo_X5BDhjZKOcAMP1pZzdBPiDq6VRlXgZ3WfW-rWc9vNbp1ADdzCGYbxguiF7O-C06p6YWdk145PvgOl2bD-w3fP3PnPRFWlm/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;}

7.Cari kode berikut </head>.

8. Copy kode dibawah ini dan paste diatas kode tersebut.

<script src='http://stripe-ad-lano.googlecode.com/files/Stripe-Ad.js' type='text/javascript'/>

9. Copy kode dibawah ini dan letakkan kembali dibawah kode <body>.


<div id='mta_bar'>
<div id='left_bar2'>
<span class='left'>
<a href='http://www.facebook.com/Dominic.NadexX.BoRneo' rel='nofollow' target='_blank' title='Add me as friend on Facebook'>Facebook</a>
<a href='http://twitter.com/LaNoHTC' rel='nofollow' target='_blank' title='Follow me on Twitter'>Twitter</a>
<a href='http://www.facebook.com/LaNoHTC' rel='nofollow' target='_blank' title='Like Fans Page Me'>Fans Page</a>
</span></div>
<div id='left_bar'>
<span class='center'><a href='http://feedburner.google.com/fb/a/mailverify?uri=blogspot/lanoblog' target='_blank;'>Gratis Berlangganan artikel LaNo via mail, join sekarang! </a></span></div>
<span class='right' onmouseout='self.status=&apos;&apos;' onmouseover='self.status=&apos;o-om.com.com&apos;;return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsU_u5ldqJvcEiG0GrWr4UoZoV6riszDJXezslsHK0_nLv139lWEH5bPDWAGDk8C_glZLgqfDUyKonKj4YngqEzdZMFCyK2hUvybGFbVh2mmIYscjP8Yi48aATTo4zoo4rGsK3jublyLHj/s400/delete.png' style='cursor:hand;cursor:pointer;'/></span></div>

10. SIMPAN
  • Keterangan
  • Ganti http://www.facebook.com/Dominic.NadexX.BoRneo dengan Facebook anda.
  • Ganti http://twitter.com/LaNoHTC dengan Twitter anda.
  • Ganti http://feedburner.google.com/fb/a/mailverify?uri=blogspot/lanoblog dengan Feedburner anda.
  • Dan Ganti Juga LaNo dengan nama anda.