Stripe-Ad Pengganti Navbar Blogger

Stripe-ad ini bukan saudaranya Stripe-tease. Aku awalnya juga kaget ketike melihat artikel berjudul "Pasang Stripe-Ad" di O-om.com. Ternyata Stripe-ad ini jauh dari stripe-tease yang sering nongol di cerita-cerita panas. Lalu apa gerangan stripe-ad itu?

Menurut o-om:

Stripe-Ad terlihat hampir serupa dengan standar Navigation Bar (Navbar) Blogger. Pengunjungpun dapat melihat langsung batang navigasi ini ketika pertama kali mereka mengunjungi halaman blog anda. Iklan ini akan tetap tampil walaupun pembaca melakukan Mouse Scroll pada halaman. Jika tertarik kemungkinan besar pembaca akan mengkliknya, jika dirasa mengganggu mereka dapat dengan mudah menutupnya dengan mengklik tombol X pada pojok kanan atas.

Nah, berhubung NoMoreWords nggak punya iklan, stripe-ad di NoMoreWords cuma berisi ucapan selamat datang. :)

Gimana cara memasang Stripe-Ad di Blogger?

Sebelum memasang Stripe-Ad, sembunyikan dulu Navigator Blogger.

Kemudian, langkah-langkah kita dalam memasang stripe-ad pun dimulai:
1. Buka Notepad
2. Kopi-paste kode di bawah ini ke notepad, kemudian save file tersebut menjadi file javascript. Caranya adalah smpan file tersebut dengan akhiran .js , misalnya stripe-ad.js
3. Upload file javascript tersebut ke file hosting. Kalo belum punya tempat hosting, bisa bikin hostingan gratis di geocities.yahoo.com
4. Masuk ke blogger bagian LAYOUT>>EDIT HTML, kemudian copi-Paste kode CSS dibawah, letakan diatas kode ]]></b:skin>

#mta_bar { background: #ffff66; 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 .left { float: left; text-align: center; font-family: Arial; font-size: 13px; font-weight: bold; font-style: normal; color: #0000FF; width:92%;}
#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: #0000FF; text-decoration: underline;}
#mta_bar .right a:hover {font-size: 10px; color: #00ffFF; text-decoration: none;}
#left_bar a { text-decoration: none; color: #0000FF; }
#left_bar a:hover { text-decoration: underline; color: #00ffFF; }

*Kode yang berwarna merah jambu merupakan warna background Stripe-Ad.
Kode yang berwarna biru tua merupakan warna untuk teks.
Kode yang berwarna biru muda merupakan warna untuk teks ketika dilewati mouse.
Silakan ganti kode warna tersebut sesuai warna selera kamu.


5. Masukan kode pemanggilan javascript dibawah ini, letakan diatas kode </head>, jangan lupa sesuaikan dengan alamat lokasi URL dimana anda meyimpan file JS-nya.

<script src='alamatjavascript' type='text/javascript'/>

6. Letakan kode dibawah ini dibawah kode <body<, Silahkan sesuaikan setingan dibawah dengan link dan deskripsi anda sendiri.

<div id='mta_bar'>
<div id='left_bar'><span class='left'><a href='http://feeds.feedburner.com/ooms-logs' target='_blank'>Kurang lebih 3200 pembaca Rss Feed sudah bergabung, Sudahkah anda?</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/AVvXsEgpHBCfw-vS9IgyDXmTWnWznA791epj5k1FbOwti6Pw7jiSSlqP-GBhtJxGZ5JiYOnIeg1oV6S1hv4DDIRT2Z8oJv3iwcF0ArSUtORVyCHnoVnLDEnTX5CLZaXp_G5H3urRKwSOEMWO/s400/close.gif' style='cursor:hand;cursor:pointer;'/></span></div>

7. Simpan

Selamat mencoba mengganti Navbar dengan memasang Stripe-Ad..