Cara Pasang Iklan Adsense Melayang Di Bawah 100% Work Versi Mobile

Source: Pixabay

Bagaimana cara memasang iklan adsense versi mobile?

Bicara soal Adsense nih, sebelum kita membahas secara detail tentang kesulitan yang kalian dapatkan saat menjadi seorang blogger. Kita harus tau dulu apa itu google adsense. Adsense merupakan platform media terbesar di era zaman modern sekarang. Jika kalian seorang blogger atau youtuber tentu adsense sudah tidak asing lagi didengar. Banyak sekali orang-orang yang berlomba-lomba untuk mendaftarkan blog mereka ke situs adsense selain melakukan hobi dengan menulis blog tetapi karya mereka tetap diharhai oleh pihak google dengan menghasilkan uang. Kunjungi situs adsense klik disini.

Lantas, apa saja yang ada di dalam adsense?

Jika kalian seorang blogger baru tentu banyak sekali hal yang harus kalian pelajari tentang adsense ini. Eits, tapi sebelum itu kalian harus daftar akun adsense terlebih dahulu kemudian kalian akan melihat pengaturan apa saja yang ada didalamnya adalah satunya adalah cara penempatan iklan yang responsive. 

Tidak hanya itu saja ada banyak sekali kode-kode yang harus kalian pelajari agar bisa mengatur situs dengan baik sehingga pengunjung suka dengan situs kalian. Tanpa basa-basi langsung saja bagaimana sih caranya agar iklan adsense tampil melayang dibawah postingan blog? Caranya sangat mudah sekali dan tentu responsive.

Berikut detail penjelasannya:

Langkah pertama

Pertama yang harus kalian lakukan adalah memasang kode ccs-nya. Letakkan kode ccs dibawah ini tepat diatas </head> 
<b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;true&quot; and not data:blog.searchQuery'>
<style>
/*<![CDATA[*/
.sticky-ad {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  overflow: visible;
  position: fixed;
  text-align: center;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 999;
  max-height: 104px;
  background-image: none;
  background-color: #fff;
  box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.2);
  margin-bottom: 0;
  padding-top: 4px;
  transition: all .4s ease-in-out;
}
.sticky-ad-close-button {
  position: absolute;
  width: 28px;
  height: 28px;
  top: -28px;
  right: 0;
  background-image: url("data:image/svg+xml;charset=utf8,%3csvg width='13' height='13' viewBox='341 8 13 13' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3e%3cg%3e%3cpath style='fill:%234F4F4F' d='M354 9.31L352.69 8l-5.19 5.19L342.31 8 341 9.31l5.19 5.19-5.19 5.19 1.31 1.31 5.19-5.19 5.19 5.19 1.31-1.31-5.19-5.19z'%3e%3c/path%3e%3c/g%3e%3c/svg%3e");
  background-size: 13px 13px;
  background-position: 9px;
  background-color: #fff;
  background-repeat: no-repeat;
  box-shadow: 0 -1px 1px 0 rgba(0, 0, 0, 0.2);
  border: none;
  border-radius: 12px 0 0 0;
  cursor: pointer;
}
.sticky-ad-close-button:before {
  position: absolute;
  content: "";
  top: -20px;
  right: 0;
  left: -20px;
  bottom: 0;
}
* {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
:active,
:focus {
  outline: 0
}
/*]]>*/
</style>
</b:if>
Jika sudah langsung saja masuk ke langkah kedua ya!

Langkah kedua

Lanjut ke langkah terakhir yaitu letakkan kode dibawah ini tepat diatas tag penutup </body> mungkin agak susah nyarinya jadi kalian scroll terus ke bawah sampai kodenya ketemu.
<b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;true&quot; and not data:blog.searchQuery'>
<div class='sticky-ad' id='sticky-ad'>
<!-- Kode iklan silahkan simpan di bawah ini -->
<!-- 320x50 -->

<button aria-label='Close this ad' class='sticky-ad-close-button' onclick='document.getElementById(&apos;sticky-ad&apos;).style.display=&apos;none&apos;;'/>
</div>
</b:if>
Silahkan pasang kode iklan yang sudah admin highlight 

Jangan lupa pasang iklan dengan ukuran 320×50 agar ukuran responsive dan tidak mengganggu si pengunjung saat membaca blog kalian.

Nah, cukup mudah bukan tidak perlu ribet untuk meletakkan kodenya. silahkan dicoba dan jika ada yang mengalami kesulitan silahkan tinggalkan pesan dikolom komentar ya.