March 6, 2010

Pasang Strip-Ad Di Blogger

Strip-Ad adalah navigasi pada bagian atas blog yang senantiasa berada di atas blog walaupun pengunjung melakukan scroll mouse. Alhasil memasang Strip-Ad sangat bagus untuk menampilkan informasi yang anda anggap penting, seperti iklan, feed atau yang lainnya.

Bagi pengguna wordpress, memasang Strip-Ad bukanlah sesuatu yang rumit dan dengan mudah mereka mendapatkan plugins ini dari situs MaxBlogPres, lengkap dengan panduan pemasangannya.

Berikut cara memasang Strip-Ad di blogger :

1. Upload File javascript di bawah ke lokasi penyimpanan file anda, contoh ripway.com. Simpan file tersebut dengan nama Stript-ad.js

var mta_arr = new Array();
var mta_clear = new Array();
function mtaFloat(mta) {
mta_arr[mta_arr.length] = this;
var mtapointer = eval(mta_arr.length-1);
this.pagetop = 0;
this.cmode = (document.compatMode && document.compatMode!="BackCompat") ? document.documentElement : document.body;
this.mtasrc = document.all? document.all[mta] : document.getElementById(mta);
this.mtasrc.height = this.mtasrc.offsetHeight;
this.mtaheight = this.cmode.clientHeight;
this.mtaoffset = mtaGetOffsetY(mta_arr[mtapointer]);
var mtabar = 'mta_clear['+mtapointer+'] = setInterval("mtaFloatInit(mta_arr['+mtapointer+'])",1);';
mtabar = mtabar;
eval(mtabar);
}
function mtaGetOffsetY(mta) {
var mtaTotOffset = parseInt(mta.mtasrc.offsetTop);
var parentOffset = mta.mtasrc.offsetParent;
while ( parentOffset != null ) {
mtaTotOffset += parentOffset.offsetTop;
parentOffset = parentOffset.offsetParent;
}
return mtaTotOffset;
}
function mtaFloatInit(mta) {
mta.pagetop = mta.cmode.scrollTop;
mta.mtasrc.style.top = mta.pagetop - mta.mtaoffset + "px";
}
function closeTopAds() {
document.getElementById("mta_bar").style.visibility = "hidden";
}

2. Masuk ke halaman Edit HTML di blogger.

Copi-Paste kode CSS di bawah, letakan di atas kode ]]></b:skin>

#mta_bar { background: #FFFFE1; 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: #0000FF; text-decoration: none;}
#left_bar a { text-decoration: none; color: #0000FF; }
#left_bar a:hover { text-decoration: underline; color: #0000FF; }

3. Selanjutnya, letakkan kode di bawah ini tepat di atas kode </head>, jangan lupa sesuaikan dengan alamat lokasi URL dimana anda meyimpan file JS-nya.

<script src='http://www.alamatserveranda.com/Stripe-Ad.js' type='text/javascript'/>

4. Letakkan 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/masrahmat-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;mas-rahmat.blogspot.com&apos;;return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='http://www.alamatserveranda.com/close.gif' style='cursor:hand;cursor:pointer;'/></span></div>

5. Simpan hasil kerja anda

“kode berwarna biru harus anda sesuaikan”

Selamat Mencoba..semoga sukses !!!

(sumber asli : o-om.com dengan beberapa perubahan)

5 comments:

  1. Pertamaaax.
    Cobain ah. Meski agak ribet..hiks hiks. Abis copy pastenya banyak amat. Mudah2an bisa. Ntar kalo bisa gua komen lagi aja. ok. Thanks a lots.

    ReplyDelete
  2. saya mau tanya kalo tampilin stripe ad nya diatas dan dibawah gimana caranya??
    jadi bukan diatas doang tampilannya..
    bls ke email saya:
    fadil.aidid@gmail.com

    ReplyDelete
  3. gw mau tampilan stripe ad bawah nya kaya di blog lo keren soalnya...
    bls secepatnya ya ke email saya!!

    ReplyDelete
  4. mas keuntungannya apa kt bs dapt dolar jg dari Adsense.hehehehe..krn aku blum pnya ikln Ad nya..

    ReplyDelete
  5. mas blog worpress saya blm ada adsennya? ksh tau ya langkah2nya kirimin email ya ke aku

    ReplyDelete