Cara Pasang Slot Iklan Responsive di Sidebar Blogger
October 27, 2024 ,

Cara Pasang Slot Iklan Responsive di Sidebar Blogger

Dalam artikel ini, kita akan membahas cara membuat dan memasang slot iklan responsive di sidebar blogger. Fitur ini sangat bermanfaat untuk meningkatkan pengalaman user dan meningkatkan revenue melalui penjualan iklan.

Cara Membuat Slot Iklan Responsive

Untuk membuat slot iklan responsive, Anda dapat menggunakan kode HTML berikut:

<div class="kotak_iklan p0">
 <div class="kotak kotak-300">
 <!-- Paste URL Gambar/Banner Disini -->
 <a href="URL IKLAN" target="_blank" rel="nofollow noopener" title="JUDUL IKLAN">
 <img src="URL GAMBAR IKLAN" alt="JUDUL IKLAN" title="JUDUL IKLAN" height="125" width="125"/>
 </a>
 </div>
 <div class="clear"></div>
</div>

Keterangan

  • URL IKLAN: Silakan Anda ganti dengan URL iklan.
  • URL GAMBAR IKLAN: Silakan Anda ganti dengan URL gambar iklan.
  • JUDUL IKLAN: Silakan Anda ganti dengan judul iklan.

Script Slot Iklan Ukuran 300 x 250 pixels

Berikut adalah script untuk slot iklan berukuran 300 x 250 pixels:

<div class="kotak_iklan p0">
 <div class="kotak kotak-300">
 <!-- Paste URL Gambar/Banner Disini -->
 <a href="URL IKLAN" target="_blank" rel="nofollow noopener" title="JUDUL IKLAN">
 <img src="URL GAMBAR IKLAN" alt="JUDUL IKLAN" title="JUDUL IKLAN" height="125" width="125"/>
 </a>
 </div>
 <div class="clear"></div>
</div>

Keterangan

  • URL IKLAN: Silakan Anda ganti dengan URL iklan.
  • URL GAMBAR IKLAN: Silakan Anda ganti dengan URL gambar iklan.
  • JUDUL IKLAN: Silakan Anda ganti dengan judul iklan.

Kode HTML Banner Iklan Melayang di Bawah Blog

Berikut adalah kode HTML banner iklan melayang di bawah blog:

<style type='text/css'>
 .stickywrap {
 width: 100%;
 margin: auto;
 text-align: center;
 float: none;
 overflow: hidden;
 display: scroll;
 position: fixed;
 bottom: 0;
 z-index: 9999
 }
 .stickyzone {
 text-align: center;
 display: block;
 max-width: 970px;
 height: auto;
 overflow: hidden;
 margin: auto
 }
 .stickyzone img {
 max-width: 100%;
 height: auto;
 vertical-align: middle
 }
 .stickyclose {
 cursor: pointer;
 text-align: center
 }
</style>
<script type='text/javascript'>
 $(document).ready(function() {
 $('#closed').click(function() {
 $('#bl_banner').hide(90)
 })
 })
</script>
<div id='stickyb' class='stickywrap'>
 <div>
 <a id='close-stickyb' onclick='document.getElementById("stickyb").style.display = "none";'><img alt='close' src='https://3.bp.blogspot.com/-6LAwZExOdHM/Xh7fAY_R5rI/AAAAAAAACB0/gHeIT7IiNKs51DmS34eoBwalg9tiL42AgCNcBGAsYHQ/s1600/sevenclose.png' title='Close this ad' class='stickyclose'/></a>
 </div>
 <div class='stickyzone'>
 <a href='https://www.bloggerkalteng.id' title='Banner iklan disini'><img alt='Banner iklan disini' src='https://1.bp.blogspot.com/-No_OydJX2ho/XnDVE9fpn8I/AAAAAAAAkBU/EcPP4Aat1BQCvXMEwzKzt2fhbRHLwEl-ACLcBGAsYHQ/s1600/bawah%2Bjudul.jpg'/></a>
 </div>
</div>

Keterangan

  • Kode yang ditandai dengan warna kuning sawo harus diganti dan disesuaikan dengan keperluan Anda.

Dengan menggunakan kode-kode di atas, Anda dapat membuat slot iklan responsive yang dapat menyesuaikan ukuran dan tampilannya berdasarkan device yang digunakan. Selain itu, Anda juga dapat menggantikan URL iklan dan gambar iklan dengan URL iklan dan gambar iklan yang sesuai dengan keperluan Anda.

Tags:
Share this