Bikin Stripe-Ad.

Postingan kali ini akan mengupas tips trik blog yang lain. Dan tentunya ada kaitannya dengan template premium ala O-Om yang sudah di share beberapa waktu kemaren. Biar template agar lebih menyerupai blog ini, saya akan share cara membuat Stripe-Ad. Mungkin para sobat gang tutorial ada yang belon mengerti apa stripe-ad tersebut? Stripe-Ad adalah sebuah Navigasi yang biasanya ditempatkan di bagian atas blog. Sobat bisa melihat contoh Stripe-Ad di bagian atas pada blog ini.

OK. dari pada ngoceh terus mending ke TKP aja
1. Login ke akun blogspot Anda
2. Buka Tab Rancangan » Edit HTML
3. Silahkan letakkan kode dibawah ini tepat di atas kode ]]></b:skin>

#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}

4. Setelah itu, Silahkan letakkan kode di bawah ini tepat diatas </body>

<script type='text/javascript'>
//<![CDATA[
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(b){var c=parseInt(b.mtasrc.offsetTop);var a=b.mtasrc.offsetParent;while(a!=null){c+=a.offsetTop;a=a.offsetParent}return c}function mtaFloatInit(a){a.pagetop=a.cmode.scrollTop;a.mtasrc.style.top=a.pagetop-a.mtaoffset+"px"}function closeTopAds(){document.getElementById("mta_bar").style.visibility="hidden"};
//]]>
</script>

5. Silahkan simpan template
6. Setelah langkah di atas selesai, buka Tab Rancangan » Elemen Halaman / Tata Letak
7. Setelah itu, click Tambah Gadget » HTML / JavaScript
8. Silahkan sobat masukkan kode di bawah ini kedalam kolom widget HTML tersebut
<div id='mta_bar'>
<div id='left_bar2'>
<span class='left'>

Masukkan link/iklan sobat di sini (tampil di bagian kiri).

</span>
</div>
<div id='left_bar'>
<span class='center' style='margin-left:20px;'>

Masukkan link/iklan sobat di sini (tampil di bagian kanan).

</span></div></div>

9. Kemudian, click Simpan

Nah, sekarang bagian terhir..silahkan lihat psyk0p4tx sobat setelah ditambah stripe-ad.
Selamat mencoba dan semoga berhasil!

Tweet