Menambahkan Iklan Melayang

Iklan ini cukup unik dan menarik karena dapat bergerak melayang ke atas dan ke bawah mengikuti pergerakan kursor. Bagi pemilik situs yang sedang monetasi situs-situsnya tentu kode yang digunakan untuk membuat iklan melayang ini sangat berguna karena sedikit memaksa pengunjung blog melakukan klik pada iklan yang disediakannya. Mungkin bagi sebagian pengunjung ada yang merasa risih dan terganggu akan kehadiran penerapan kode ini, tapi kembali pada hak pemilik situs apakah tertarik menerapkan kode ini atau tidak karena tidak semua pengunjung merasa terganggu, apalagi jika pengunjung tersebut benar-benar membutuhkan informasi yang diinginkannya dan informasi tersebut dianggap berharga. 

Langsung saja ikuti petunjuk singkat di bawah ini kawan, berikut praktek menambahkan iklan melayang di blogger:
1. Seperti biasa masuk ke dalam kustomisasi blog. Klik tab Design (Tata Letak) > Page Element (Elemen Halaman).
2. Tambahkan gadget HTML/JavaScript, lalu masukkan kode iklan di bawah ini:


<style type="text/css">
#gb{
position:fixed;
top:10px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbcontent{
float:right;
border:2px solid #A5BD51;
background:#ffffff;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, -1500) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5: 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<div style="text-align:right">
<a href="javascript:showHideGB()">
.:[Close]:.
</a>
</div>
<center>

Masukan kode iklan atau gambar di sini

</center>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.center = (30-gb.offsetWidth).toString() + "px";
</script></div></div>


3. Klik tombol Save (Simpan) dan apa yang terjadi?
4. Lihat hasilnya, maka akan muncul iklan melayang di bagian atas. Klik link Close sebanyak dua kali dan iklanpun akan hilang.
5. Selain iklan teks, anda juga dapat memasukkan iklan berupa gambar.
6. Selamat mencoba kawan.

This work is protected by Copyscape and licensed under a Creative Commons Attribution - Non Commercial - Share Alike 3.0 Unported License. Articles cannot be reproduced without permission from the author. For any reuse or distribution, you must make clear to others the license terms of this work. The best way to do this is with a link to this web page.

Silakan tinggalkan jejak anda dengan berkomentar, Insya Allah agar saya bisa rutin mengunjungi blog anda. Jika belum paham mengenai artikel Menambahkan Iklan Melayang, tanyakanlah. Jika ada usulan atau keluhan, izinkanlah saya mengetahuinya. Tanggapi dengan komentar yang bijak dan jangan sia-siakan waktu anda dengan melakukan spam.

0 Komentar:

Post a Comment