Cara Membuat Iklan Sticky Ads di Bagian Bawah Blogger

Cara Membuat Iklan Sticky Ads di Bagian Bawah Blogger

Ikan sticky ads ini biasanya sudah diberikan oleh Google Adsense sendiri yaitu iklan Auto Ads, akan tetapi iklan sticky ads yang diberikan oleh google adsense ini muncul hanya di tampilan mobile saja. Pada kesempatan kali ini saya akan berbagi tutorial Cara Membuat Iklan Sticky Ads di Bagian Bawah Blogger

Jika anda bertanya apakah jenis iklan ini melanggar atau tidak akan saya jawab tidak, karena saya sendiri sudah menggunakannya. Dikarenakan kita hanya menggunakan iklan sticky yang berukuran 728x90 px, yang melanggar dari kebijakan google adsense itu ketika anda menggunakan iklan yang lebih besar dari itu

Iklan sticky yang akan saya berikan ini juga tidak akan mengganggu, dikarenakan iklannya bisa di close, berbeda dengan iklan sticky ads (auto ads) dari google adsense yang tidak bisa di close (hanya bisa di sembunyikan saja)

Sebenarnya banyak yang sudah memberikan tutorial ini di internet, akan tetapi akan saya bagikan lagi dengan gaya bahasa dan pengalaman saya sendiri. Daripada berlama-lama yuk langsung saja simak tutorialnya dibawah ini

Cara Membuat Iklan Sticky Ads di Bagian Bawah Blogger



1. Login ke akun Blogger anda

2. Lalu cari meni Tema > Edit HTML

3. Kemudian copy kode yang saya berikan dibawah ini dan letakkan diatas </head>


<b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;false&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:sticky;text-align:center;bottom:-104px;left:calc(50% - 368px);width:736px;z-index:999;max-height:104px;background-image:none;background-color:#fff;box-shadow:0 0 5px 0 rgba(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,.2);border:none;border-radius:12px 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>

4. Setelah itu masukan script dibawah ini tepat diatas </body>


<b:if cond='data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;false&quot; and not data:blog.searchQuery'>
<div class='sticky-ad' id='sticky-ad'>
<ins class='adsbygoogle' data-ad-client='ca-pub-0000000000000000' data-ad-slot='0000000000' style='display:inline-block;width:728px;height:90px'/><script>(adsbygoogle = window.adsbygoogle || []).push({});</script>
<button aria-label='Close this ad' class='sticky-ad-close-button' onclick='document.getElementById(&apos;sticky-ad&apos;).style.display=&apos;none&apos;;'/>
</div>
<script>
//<![CDATA[
window.addEventListener("scroll",function(){
  var target = document.getElementById('sticky-ad');
  if(window.pageYOffset > 300){
   target.style.bottom = "0";
  }
},false);
//]]>
</script>
</b:if>

5. Simpan / Save Tema

Silahkan ganti kode yang sudah saya tandai Biru dengan kode iklan anda masing-masing, usahakan gunakan iklan yang berukuran 728x90px 

Demikian tutorial saya yang berjudul Cara Membuat Iklan Sticky Ads di Bagian Bawah Blogger, jika ada pertanyaan seputar tutorial diatas silahkan tanyakan pada kolom komentar ya agar bisa saya bantu

Semoga dengan adanya artikel ini bisa membantu anda untuk membuat iklan sticky ads di tampilan desktop agar bisa mendapatkan penghasilan tambahan hehe. Sekian tutorial dari saya dan Semoga bermanfaat


2 komentar