Cara Memasang Iklan Respondsive Dengan Tombol Close

Cara Syarif - Memasang iklan respondsive dibawah footer dengan tombol close. Dengan seiring perkembangan jaman dan teknologi, banyak yang menggunakan beberapa alat seperti komputer dan samrtphone untuk mencari informasi di internet. Kita mendapatkan uang dari blog sebagai publisher dengan cara menampilkan iklan kepada pengunjung.

Credit image by: Cara Syarif

Apabila yang mengunjungi blog Anda menggunakan komputer/laptop tidak akan menjadi masalah karena komputer memiliki resolusi layar yang besar, nah bagaimana jika yang mengunjungi blog Anda menggunakan Smartphone, dengan resolusi layar yang kecil. Iklan pada blog Anda akan menghalangi sebagian artikel/postingan yang dibutuhkan oleh pengunjung.

Secara tidak langsung pengunjungpun akan merasa terganggu dan meninggalkan blog Anda untuk mencari informasi dari blog lain. Sangat disayangkan bukan, oleh sebab itu disini saya akan membagikan cara memasang iklan respondsive dengan tombol close, jadi pengunjung tidak akan merasa terganggu karena tersedia tombol close dan ukuran iklan yang dipasang pada blog Anda pun bentuknya akan menyesuaikan dengan layar gadget yang digunakan oleh pengunjung karena sudah dibuat respondsive.

Cara memasang iklan respondsive dengan tombol close

1. Masuk ke Blogger > Dashboard > Template > Edit HTML

2. Kemudian tambahkan kode dibawah ini tepat sebelum kode </body>

<script type='text/javascript'>
$(document).ready(function() {$(&#39;img#closed&#39;).click(function(){$(&#39;#bl_banner&#39;).hide(90);});});
</script>
<div id='fixedban' style='width:100%;margin:auto;text-align:center;float:none;overflow:hidden;display:scroll;position:fixed;bottom:0;z-index:999;-webkit-transform:translateZ(0);'>
<div><a id='close-fixedban' onclick='document.getElementById(&apos;fixedban&apos;).style.display = &apos;none&apos;;' style='cursor:pointer;'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9QvPGaUu1uFXaEQE3_iwPwxi6HrGqGraY_MjRUCKCgPVaEb_JFeVsOx8_XXjCbt-g8vIRawY49Fm7mWXCIksqAX6G-I2TEXWIWWWvCzr10qusqQDD5SdHWrSsSQ-WFdeHAP_LTWAAB2Jz/s1600/btn_close.gif' title='close button' style='vertical-align:middle;'/></a></div>
<div style='text-align:center;display:block;max-width:728px;height:auto;overflow:hidden;margin:auto'>
<a href='#' title='Banner iklan disini'><img style='max-width:100%;height:auto;vertical-align:middle;' alt='Banner iklan disini' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4j22yjexS04Yq_rK1kVnnc-jF4VT85UXlclzM8S3oXVmIETGHHflFGe-MWIvYNMo_Zc2oapWgfv-pUl0GVLdd2cJPq5GtCVzsbfB8avSNbzt_SdyDKcVb1hvAPg9AaMzZXDH0dIvYjaYW/s640/carasyarifbanner.png'/></a>
</div>
</div>

3. Ganti yang saya tandai dengan warna biru dengan kode iklan Anda, lalu klik simpan.

Catatan : Jika ukuran banner di atas 728x90 ubah juga ukuran width nya, namun jika ukuran iklan dibawah resolusi 728x90 biarkan saja, jangan di ubah ukurannya.

Tweet

Subscribe to receive free email updates: