Cara Membuat Strip Ads

Terima kasih atas requestnya sobat, sehingga saya tidak bingung untuk memikirkan atau bingung untuk memposting apa, hehe, langsung saja sobat berikut cara untuk memasang widget " Sudah Gabung Bersama PortableTech?,join sekarang! " atau biasa disebut strip ads seperti punya sayahehe, Ok langsung saja begini sob,

1. Login Ke Blogger.... lalu ke Menu Edit Html
2. Copykan Script berikut ini, di atas ]]></b:skin>

/*-- (mta bar) --*/
#mta_bar{background:#000; border-bottom:2px 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:7px; padding-bottom:4px;
z-index:10000;opacity: 0.9;filter: alpha(opacity: 90);}
* 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:13px; font-weight:bold; font-style:normal; color:#FFFFFF; width:65%}
#mta_bar .left{float:left; text-align:left; font-family:Verdana,Arial; font-size:13px; font-weight:normal; font-style:normal; color:#FFFFFF; width:20%}
#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:#FFFFFF; text-decoration:none}
#mta_bar .right a:hover{font-size:10px; color:#80ff00; text-decoration:none}
#left_bar a{background:url('http://remoxp.hostzi.com/FaceBook.png') no-repeat; text-decoration:none; color:#FFFFFF; padding-left:23px; padding-right:0; padding-top:0; padding-bottom:0}
#left_bar a:hover{text-decoration:none; color:#80ff00}
#left_bar2 a{background:url('http://remoxp.hostzi.com/FaceBook.png') no-repeat 2px; text-decoration:none; color:#FFFFFF; padding-left:21px; padding-right:0; padding-top:0; padding-bottom:0}
#left_bar2 a:hover{text-decoration:none; color:#80ff00}
#to_top{background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtC6dQoVngvSCASnYgwbcegCtryUt4CxNbxxv9ST2d4Oy8KZWmd8RG-O_WMjHikarppbJLsxeq2WvrtIxms5XEcyz1blmm474tiSdYwbK2OpWPDKEmm28qCkF-3lBIC_JH_2RsL5qDDd-m/s400/delete.png) no-repeat scroll 0%; position:absolute; /*this replaces float - fixes thanks to Larry ofhttp://blog.lroot.com*/height:18px; width:19px; margin:0 0 0 900px; /*this was updated*/padding:9px 5px}
#anima_sudut2 a:link {
color:#000000;
}
#anima_sudut2 a:visited {
color: #FFFFFF;
text-decoration:none;
}
#anima_sudut2 a:hover {
color: #000000;
}
#to_top a{padding:8px}
a.tip {position:relative}
a.tip span {
display:none;
padding:5px;
z-index:100;
background:#000;
color:#fff;
text-decoration:none;
width:200px; /* lebar tooltip */
height:auto;
-moz-border-radius:2px;
-webkit-border-radius:2px
}
a:hover.tip {
font-size:99%;
cursor:pointer
}
a:hover.tip span {
display:block;
position:absolute;
-moz-opacity:0.7;
opacity:0.7;
top:-40px;
left:auto;
right:-2px;
bottom:auto;
line-height:14px;
font-size:12px;
font-weight:normal;
}
.menu{
border:none;
border:0px;
margin-left:35px;
padding:0px;
font-size:13px;
}
.menu ul{
background:#000000;
height:2px;
list-style:none;
margin:0;
padding:0;
}
.menu li{
float:left;
padding:0px;
}
.menu li a{
background:#000000;
color:#80ff00;
display:block;
font-weight:normal;
line-height:30px;
margin:0px;
padding:0px 10px;
text-align:center;
text-decoration:none;
}
.menu li a:hover, .menu ul li:hover a{
background: #212121;
color:#80ff00;
text-decoration:none;
}
.menu li ul{
background:#000000;
display:none;
height:auto;
padding:0px;
margin:0px;
border:0px;
position:absolute;
width:180px;
z-index:200;
/*top:1em;
/*left:0;*/
}
.menu li:hover ul{
display:block;
}
.menu li li {
display:block;
float:none;
margin:0px;
padding:0px;
width:180px;
}
.menu li:hover li a{
background:none;
}
.menu li ul a{
display:block;
height:30px;
font-size:12px;
font-style:normal;
margin:0px;
padding:0px 10px 0px 15px;
text-align:left;
}
.menu li ul a:hover, .menu li ul li:hover a{
background:#212121 center left no-repeat;
border:0px;
color:#80ff00;
text-decoration:none;
}
.menu p{
clear:left;
}

Catatan :
*Kode warna merah adalah kode warna. Silahkan sesuaikan dengan keinginan anda.
*Kode warna hijau berfungsi untuk membuat warna kelihatan transparant. Anda bisa menghapusnya atau membiarkannya.
*Sedangkan yang berwarna kuning adalah alamt url gambar. Silahkan sesuaikan dengan kebutuhan dan keinginan anda.

3. Masukan kode pemanggilan JavaScript atau JS dibawah ini, letakan diatas kode </head>

<script src="http://strip-ads.googlecode.com/files/strip-ads-versi2.js" type="text/javascript"></script>

atau menggunakan alamat Javascript yang sudah kamu uploud

<script src="http://alamat file javascript kamu.js" type="text/javascript"></script>

4. Letakan kode dibawah ini dibawah kode <body>, Silahkan sesuaikan setingan dibawah dengan link dan deskripsi kamu sendiri.

<div id='mta_bar'>
<div id='left_bar2'>
<span class='left'>
<a href='http://www.facebook.com/group.php?gid=122363254474410' target='_blank'>Login to Facebook</a></span></div>
<div id='left_bar'>
<span class='center'><a href='http://www.facebook.com/group.php?gid=122363254474410' target='_blank;'>Sudah Gabung Bersama PortableTech?,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='http://lh4.ggpht.com/_QfufFNlfNgs/TEFGnF1yYBI/AAAAAAAAADM/d659lgBAzSI/delete.png' style='cursor:hand;cursor:pointer;'/></span></div>

5. Simpan dan lihat hasilnya :)

Jika kurang jelas atau gagal bisa ditanyakan :)

Selamat mencoba dan semoga berhasil..!!!

Artikel Terkait: