Beranda
Blogger

Cara Memasang Lazy Load AdSense di Blogger

Lazy Load AdSense adalah metode untuk menunda pemuatan iklan sampai elemen tersebut benar-benar dibutuhkan, yakni ketika pengunjung menggulir halaman
Kode Violet
Cara Memasang Lazy Load AdSense di Blogger

Hai teman-teman Blogger! Kalau kalian sering merasa blog jadi lambat karena banyak iklan dari AdSense yang muncul langsung saat halaman dimuat, artikel ini cocok banget buat kalian. Pada kesempatan ini kodeviolet.com akan membahas tentang Cara Memasang Lazy Load AdSense di Blogger, teknik jitu agar performa blog tetap optimal tanpa harus mengorbankan penghasilan dari iklan.

Apa itu Lazy Load AdSense?

Lazy Load AdSense adalah metode untuk menunda pemuatan iklan sampai elemen tersebut benar-benar dibutuhkan, yakni ketika pengunjung menggulir halaman dan bagian iklan mulai terlihat. Dengan cara ini, halaman akan terasa lebih cepat saat dibuka.

Keuntungan Menggunakan Lazy Load

Keuntungan Penjelasan
Meningkatkan Kecepatan Elemen iklan tidak dimuat di awal, sehingga halaman terasa lebih ringan.
Meningkatkan Pengalaman Pengguna Pengunjung tidak terganggu oleh banyaknya elemen yang dimuat sekaligus.
Potensi Meningkatkan Viewability Iklan hanya muncul saat dibutuhkan, meningkatkan rasio tampil-dilihat.

Langkah-langkah Memasang Lazy Load AdSense di Blogger

  1. Buka Blogger
  2. Pilih menu Tema
  3. Pada SESUAIKAN, pilih Edit HTML
  4. Kemudian letakkan kode ini tepat berada diatas kode </body> 
    <script>
//<![CDATA[
var lazyadsense = false;
window.addEventListener("scroll", function(){
if ((document.documentElement.scrollTop != 0 && lazyadsense === false) || (document.body.scrollTop != 0 && lazyadsense === false)) {
(function() { var ad = document.createElement('script'); ad.setAttribute('crossorigin','anonymous'); ad.async = true; ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-xxxxxxxxxxx'; var sc = document.getElementsByTagName('script')[0]; sc.parentNode.insertBefore(ad, sc); })();
lazyadsense = true;
  }
}, true);
//]]>
</script>
  5. Ganti xxxxxxxxxxx yang saya beri mark dengan ID AdSense , untuk mengaktifkan lazyload auto adsensenya juga
  6. Jika sudah pilih Simpan Tema
  7. Untuk menerapkan iklan adsense, cukup harus script bawaannya seperti yang saya beri mark dan letakkan kode iklan di tempat yang diinginkan 
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1897375083753292"
     crossorigin="anonymous"></script>
<!-- Display widget -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-12345678"
     data-ad-slot="12345"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>
  8. Maka hasilnya akan seperti ini 
    <ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-12345678"
     data-ad-slot="12345"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

Tips Tambahan

  • Gunakan hanya 2-3 iklan per halaman agar tetap nyaman dibaca
  • Pastikan tema Blogger kalian mendukung IntersectionObserver (semua browser modern sudah mendukung)
  • Jangan lupa verifikasi hasilnya di PageSpeed Insights

Kesimpulan

Itulah tadi artikel dari kodeviolet.com tentang Cara Memasang Lazy Load AdSense di Blogger. Dengan cara ini, blog kalian akan tetap cepat dan user-friendly tanpa kehilangan potensi penghasilan dari iklan. Selamat mencoba dan semoga sukses, teman-teman!

Posting Komentar