Membuat dan Pasang Iklan Melayang atau Floating di Blog Dengan Tombol Close
Membuat dan Pasang Iklan Melayang atau Floating di blog bukanlah hal yang sulit di lakukan.
Cukup dengan menambahkan sebuah script di dalam template blog Anda iklan akan muncul dengan responsive atau menyesuaikan ukuran tampilan blog yang Anda miliki, tentunya di sertai dengan tombol close yang akan membuat pengunjung blog Anda dapat menutup iklan tersebut dengan mudah.
Hanya dengan menggunakan kode JavaScript yang simpel iklan ini tidak akan menggangu kecepatan loading blog Anda. Tidak hanya kode iklan saja yang bisa anda tambahkan melainkan kode lainya seperti untuk menayangkan Fanspage, Grup facebook, Subscriber blog, Profil Anda dan masih banyak lagi terserah Anda mau menampilkan apa.
Kali ini saya akan memberikan cara membuat dan pasang iklan melayang hanya untuk pengguna Blogger, jika Anda tertarik silahkan ikuti langkah-langkah berikut :
Cara Menampikan Iklan Melayang di Blog
Versi 1
1. Login ke akun Blogger Anda, masuk ke dasbor, klik Template, pilih edit HTML.
1. Login ke akun Blogger Anda, masuk ke dasbor, klik Template, pilih edit HTML.
2. Cari kode </body>, jika Anda kesulitan silahkan tekan Ctrl+F di dalam HTML blog Anda untuk memudahkan pencarian.
 |
| Ini contoh jika anda mencari kode </body> |
3. Silahkan Copy kode di bawah ini dan letakkan atau paste kode ini tepat di atas kode </body>.
4. Simpan Template dan lihat hasilnya di blog kalian.<script type='text/javascript'>
$(document).ready(function() {$('img#closed').click(function(){$('#btm_banner').hide(90);});});
</script>
<!--start: floating ads-->
<div id='floatads' style='width:100%;margin:auto; text-align:center;float:none;overflow:hidden; display:scroll;position:fixed; bottom:0;z-index:9999'>
<div><a id='close-floatads' onclick='document.getElementById('floatads').style.display = 'none';' style='cursor:pointer;'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtlgc9g3DhgahJSFdB8NzF6gIiOK-yCHtYRMhWAkB30IOPsrkq634agJCR8KxYJng_UMEkE2j5LGwKKaz4BmY7k8blP0Oh8rT2Tf60rJzWZFAwRQHJ-Z4DImuHclkdKsrSC7V8mHh45eA/s1600/btn_close.gif' title='close button'/></a></div>
<div style='text-align:center;display:block;max-width:720px;height:auto;overflow:hidden;margin:auto'>
<!--Awal Script iklan-->
Masukan Kode Iklan Anda di Sini
<!--Akhir script iklan-->
</div>
</div><!--end: floting Ads-->
Catatan :
- Kode yang berwarna biru itu adalah kode untuk ukuran iklan, bisa anda ubah sesuka kalian.
- Sedangkan yang berwarna merah kalian ganti dengan kode iklan yang akan anda tampilkan.
Versi 2
Sama seperti versi 1, simpan kode di bawah ini di bawah kode </blody>
<script type='text/javascript'>Keterangan :
$(document).ready(function() {$('img#closed').click(function(){$('#bl_banner').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('fixedban').style.display = 'none';' style='cursor:pointer;'><img alt='close' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYwkGeF4E3G66Eno_7uV3wWhuRU56ccv91Uv2mxf5TykKspoxqx9CJTLFuxQYtYUigRg5YqRSn_QnR0hQvZOjBSb-bU3Xqvh6jnsLQax3ltR4c8wmA5YLP5p6efE4s9jdQLHaNVKN-6DBa/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/AVvXsEg5q3BKy9PMku7-koNt0EQTzX0l7J32I__NsPj0Y_zOdSXxEQ5Cm82cMH4uc-My6NcDDnYE1TMcdhtiQbnI_vyWhNbfskQc4pb1SiZUyoUML5ExGNu1geW6-o7Wi3i-R58UIIZilJBSho6x/s1600/arlina-tea.png'/></a>
</div>
</div>
- Yang membedakan versi ke 2 ini adalah iklan yang akan Anda tampikan berupa link URL dari gambar produk lainya yang ingin Anda tampilkan, bukan berupa script lagi.
- Silahkan ganti ukuran iklan di tulisan yang berwarna biru.
- ganti tanda # dengan URL ikan anda,
- Beri nama iklan anda pada bagian title yang berwarna merah.
Sangan mudah kan membuat dan pasang iklan melayang atau floating di blog Anda sendiri. Demikian artikel ini semoga bisa membantu dan menyelesaikan masalah anda seputar blogger.