Stripe-ads akan selalu tampil diatas walau kita menscroll ke bawah, dan kita bisa mengclose-nya jika kita merasa risih dengan adanyaStripe-ads. Membuat Stripe-ads lebih baik baik dari padamenampilkan iklan dengan Pop UP. Stripe-ads akan selalu terlihat tapi juga bisa dengan mudah orang mengklik close.
Cara Membuat Stripe-ads di Blog
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode berikut ]]></b:skin> dan Tambahkan kode berikut inidi atasnya
#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; }
* 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; }
6. Cari kode </head> dan tambahkan kode berikut ini di atasnya
<script src='http://sites.google.com/site/asrizalofficialweb/javascript/Stript-ad.js' type='text/javascript'/>
7. Cari kode </body> dan taruh kode berikut ini di atasnya
<div id='mta_bar'>
<div id='left_bar'><span class='left'><a href='http://twitter.com/kurniasepta' target='_blank'>Follow Me On Twitter</a></span></div>
<span class='right' onmouseout='self.status=''' onmouseover='self.status='o-om.com.com';return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUC9698TfpHjy9LVO9QiCjwA5GDBVrp1IrIo14Pz0qYdoULIjBe9bxRs820FNS-OLg8AdnjAUOdbgbc2EMZZ5MlSMnKmqmmOaD9C3IKAs4LxwchAuIqi25d37Ste5y6wxBeU3BQRtT5CiJ/' style='cursor:hand;cursor:pointer;'/></span></div>
<div id='left_bar'><span class='left'><a href='http://twitter.com/kurniasepta' target='_blank'>Follow Me On Twitter</a></span></div>
<span class='right' onmouseout='self.status=''' onmouseover='self.status='o-om.com.com';return true;'> <img align='absmiddle' border='0' onClick='closeTopAds();return false;' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUC9698TfpHjy9LVO9QiCjwA5GDBVrp1IrIo14Pz0qYdoULIjBe9bxRs820FNS-OLg8AdnjAUOdbgbc2EMZZ5MlSMnKmqmmOaD9C3IKAs4LxwchAuIqi25d37Ste5y6wxBeU3BQRtT5CiJ/' style='cursor:hand;cursor:pointer;'/></span></div>
Kita dapat mengganti http://twitter.com/kurniasepta dan Follow Me On Twitter dengan URL dan judul yang kita inginkan.
8. Simpan Template jika sudah selesai
0 comments:
Post a Comment