Minggu, 03 Oktober 2010

Ads Popup - Iklan Yang Muncul Tiba-tiba (Update!)


Sudah mencoba artikel "Membuat Wadah Iklan Tiba-tiba Muncul (Ads Popup Container)"? Nah, artikel ini merupakan update dari artikel sebelumnya yang tentunya dengan tampilan baru dan lebih segar. Walaupun masih menggunakan script yang sama tapi sekarang Blogger TuneUp menggunakan sentuhan yang lebih bagus pada kode CSS versi 3. Penasaran?


Menambahkan Ads Popup - Iklan Yang Muncul Tiba-tiba pada Blogger

Langkah 1
Login ke Blogger
Langkah 2
Masuk ke "Rancangan - Elemen Laman"
Langkah 3
Klik "Tambah Gadget" dan pilih type "HTML/JavaScript"
Langkah 4
Masukan kode dibawah ini pada bagian konten

<style type="text/css">

#topbar {

 position:absolute;

 z-index: 100;

 padding: 8px;

 background: #eee;

 background: -moz-linear-gradient(top, rgba(255, 255, 255, .9), rgba(211, 211, 211, .9));

 background: -webkit-gradient(linear,left top,left bottom,from(rgba(255, 255, 255, .9)),to(rgba(211, 211, 211, .9)));

 border: 1px solid #fff;

 border-radius: 10px;

 -webkit-border-radius: 10px;

 -moz-border-radius: 10px;

 -webkit-box-shadow: #600 0 2px 15px;

 -moz-box-shadow: #600 0 2px 10px;

 margin:0 auto 10px;

 float:left;

 color:rgba(0, 0, 0, 0.75);

 font-size: 12px;

 font-family: Verdana, serif;

 text-shadow:0 1px 0 #FFFFFF;

}

#topbar img {

 border:none;

}

#topbar .tombol {

 margin:0;

 padding-bottom:5px;

 text-align:right;

}

#topbar .tombol button {

 color:#FFFFFF;

 border: solid 1px #494949;

 margin:0;

 padding:2px 15px;

 cursor: pointer;

 text-shadow: 0 1px 1px rgba(0,0,0,.6);

 background: #5f5f5f;

 background: -webkit-gradient(linear, left top, left bottom, from(red), to(#454545));

 background: -moz-linear-gradient(top, red,  #454545);

}

#topbar .isi_iklan {

 background-color:#FFFFFF;

 margin:0;

 padding:4px;

 width: 468px;

 border: 1px solid #999;

}

</style>

<script src="http://hensblog.googlecode.com/files/js_pop_up.js" type="text/javascript"></script>

<script type="text/javascript">

var persistclose=1

var startX = 20

var startY = 20

var verticalpos="fromtop"

</script>

<div id="topbar">

<div class="tombol"><a href="" onclick="closebar(); return false" style="text-decoration: none;"><button>Tutup</button></a></div>

<div class="isi_iklan">

<!-- Kode Iklan-->

</div>

<a style="text-decoration: none; color: #00f; text-align:right; display: block; font-size: 10px;" href="http://modification-blog.blogspot.com/2010/09/ads-popup-iklan-yang-muncul-tiba-tiba.html" target="_blank" title="Ads Popup">Widget by <span style="color: #333;">Blogger</span> <span style="color: #f00;">TuneUp</span></a>

</div>
Langkah 5
Klik tombol simpan dan preview blog anda... (Hmm... Baguskan?)