Skip to content Skip to sidebar Skip to footer

Cara Pasang Iklan Parallax di Tengah Postingan

Anangzd.com - Berikut Cara Pasang Iklan Parallax di Tengah Postingan Blogger. Di kesempatan kali ini saya akan membuat panduan cara memasang Iklan Parallax di Tengah Postingan dengan kode javascript murni agar loding situs dan iklan Parallax muncul cepat atau tidak membebani loding situs blog atau iklan tersebut.

Apa Itu Iklan Parallax?
Parallax adalah iklan yang menempel dan berada di "belakang" halaman post. Posisinya akan tetap diam saat di scroll ke bawah atau atas dan posisi iklan di "dalam".

Misal kita membuka halaman postingan atau artikel lalau scroll ke atas bawah iklan tersebut muncul hanya diam tidak ke atas atau pun bawah.

Nah sekarang kalian sudah paham tentang maksud dan arti Iklan Parallax ya. Jika Anda tertarik saya akan membuatkan Code Iklan Parallax di blogger yang bisa kalian pasang pada situs blog sendiri. Perlu di ingat, baca artikel ini saya mapai selesai agar saat Anda mempraktekan tidak ada kesalahaan.

Cara Pasang Iklan Parallax di Tengah Post

Berikut pandauan cara membuat Iklan Parallax di postingan tengah

Code Iklan Iklan Parallax yang harus di pasang pada Tema blogger

Kalau kalian menggunakan Iklan dari Google Adsense buat terlebih dahulu tampilan iklan dengan format Display lalau ubah menjadi Vertikal, agar tampilan iklan yang mucul nanti sepanduk ke bawah memanjang.

1. Kujungi halaman www.blogger.com . Masukan email dan password
2. Pilih Tema > Edit HTML
3. Cari kode ]]></b:skin> lalu pasang kode dibawah ini tepat di atas nya.

/* iklan paralax by wendy code  */
.anangzdparalax{position:relative;display:block;overflow:visible;width:100%;height:0;margin:auto;text-align:center;z-index:1}
.anangzdparalax > div{overflow:hidden;width:100%;height:100%;margin:0;position:absolute;top:0;left:0;clip:rect(auto auto auto auto)}
.anangzdparalax > div > div{width:calc(100% - 40px);height:100%;position:fixed;top:0;left:0;right:0;margin:0 auto;-moz-transform:translateZ(0);-webkit-transform:translateZ(0);-ms-transform:translateZ(0);-o-transform:translateZ(0);transform:translateZ(0)}
.anangzdparalax> div > div > div{display:-webkit-box;display:-webkit-flex;display:-moz-box;display:-ms-flexbox;display:flex;-webkit-align-content:center;align-content:center;-webkit-align-items:center;-ms-flex-align:center;width:100%;height:100%;position:absolute;left:0;right:0;top:37px;align-items:center;background:#fff}
.anangzdparalax > div > div > div > *{margin:auto}
.anangzdparalax > div > div > div > a{width:100%;height:100%}
.anangzdparalax img,.anangzdparalax iframe,.anangzdparalax ins{height:100%;border:0}
.clear{clear:both;display:block}
.anangzdparalax{width:100%;min-width:300px;min-height:600px;text-align:center}
.adParallax{width:100%;min-width:300px;min-height:600px;text-align:center;display:block; margin:10px 0px; padding:0px;}

4. Cari kode <data:post.body/> lalau pasang kode dibwah ini letakan di bawah kode tersebut

<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
 <b:if cond='data:view.isPost'>
  <div class='anangzdparalax'>
   <div>
    <div>
      <div>
       <ins class='adsbygoogle adParallax' data-ad-client='ca-pub-8802465226xxxxxx' data-ad-slot='290125xxxx' style='display:block'/>
        <script>
        (adsbygoogle = window.adsbygoogle || []).push({});
        </script>
      </div>
    </div>
  </div>
 <span class='clear'/>
</div>
<script> //<![CDATA[
// munculkan iklan pada pragraf sekian by https://www.anangzd.com 
function anangzdparalax(Ad1) {let paralax = document.getElementsByClassName ('anangzdparalax')[0]; if (paralax) {let Adsp = document.querySelectorAll ('.post-body p')[Ad1 - 1]; Adsp.parentNode .insertBefore (paralax, Adsp.nextSibling)}} anangzdparalax(4);/*]]>*/</script></b:if></b:if>

5. Silakan ganti kode ads ca-pub-8802465226xxxxxx dan data-ad-slot='290125xxxx' milik Anda. cari kode anangzdparalax(4); angka 4 artinya iklan akan muncul setelah pragraf ke 4 silakan di ubah.

Itulah tips tutorial cara membuat dan memasang Iklan Parallax di Tengah Postingan dengan mudah. Semoga artikel tentang Iklan Parallax dapat bermanfaat atau mebantu Anda. Terima kasih sudah berkujung di wwww.anangzd.com.

Anang_at
Anang_at Belajar dari hal kecil, ingin menjadi orang Berhasil. Optimis, pasti bisa mencapai apa yang di inginkan.

Post a Comment for "Cara Pasang Iklan Parallax di Tengah Postingan"