Cara Memasang Lazy Load Adsense di Blogger [Load on Scroll]
Setelah sebelumnya saya share tentang cara memasang lazy load Analytics di Blogger, sekarang saya mau share juga cara memasang lazy load untuk script iklan Google Adsense di Blogger.
Untuk kamu yang belum tahu apa itu lazy-loading, sederhananya ini adalah script yang menunda loading dari beberapa script yang kita tentukan untuk nantinya di load setelah elemen lain di blog kita selesai di load.
Atau lebih sederhananya lagi, script ini membantu performa loading web kita jadi lebih cepat.
Salah satu faktor yang seringkali mempengaruhi loading website adalah iklan, apalagi kalau itu iklan pihak ketiga seperti AdSense. Namun, kita tidak perlu khawatir karena itu sudah ada solusinya dan solusi ini adalah white-hat trick yang tidak bertentangan dengan pedoman AdSense, jadi nggak usah khawatir banned.
Buat kamu yang sudah bergabung bersama AdSense atau yang baru bergabung dan masih menunggu proses review, boleh ikuti panduan singkat berikut ini untuk memasang script lazy-loading AdSense di template Blogger kamu.
Panduan
Langkah 1 - Login ke akun Adsense, Ambil Kode Unik Iklan
Baiklah, langkah pertama, silahkan kamu log in ke Google AdSense menggunakan akunmu. Setelah itu, copy kode unik pengiklan kamu lalu simpan di Notepad.
Langkah 2 - Login ke Blogger
Setelah kamu mendapatkan kode unik pengiklan AdSense kamu, silahkan kamu masuk ke Blogger.com menggunakan akun blog kamu. Karena kamu sudah login AdSense sebelumnya, harusnya kamu otomatis masuk ke akun Blogger kamu.
Langkah 3 - Masuk Menu Edit HTML Template
Di halaman muka Blogger, silahkan kamu masuk ke halaman Theme, setelah itu pilih panah ke bawah, lalu kamu akan melihat menu pilihan Edit HTML. Silahkan kamu pilih menu tersebut.
Langkah 4 - Cari Kode Script Bawaan dari AdSense
Jika kamu adalah publisher lama yang sudah memasang iklan AdSense di blogmu, maka kamu perlu menghapus terlebih dahulu script kamu yang lama. Caranya mudah, kamu hanya perlu mencari link berikut ini: //pagead2.googlesyndication.com/pagead/js/adsbygoogle.js di template-mu. Jika sudah, silahkan kamu hapus kode tersebut secara keseluruhan. Biasanya script berbentuk seperti gambar di atas.
Langkah 5 - Cari kode </head> atau </head>
Di halaman ini kamu akan melihat script lengkap dari template Blogger kamu. Silahkan kamu cari kode </head> atau </head> di template blogger kamu. Agar lebih mudah, kamu bisa menggunakan fitur find dengan menekan tombol CTRL+F di bagian script box.
Langkah 6 - Masukkan Code Lazy Load AdSense di atas </head> atau </head>
Jika kode sudah ketemu, langkah selanjutnya yang perlu kamu lakukan adalah menaruh script berikut ini:
<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('data-ad-client','<mark>ca-pub-8621755121881056</mark>');ad.setAttribute('crossorigin','anonymous'); ad.async = true; ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'; var sc = document.getElementsByTagName('script')[0]; sc.parentNode.insertBefore(ad, sc); })();lazyadsense = true;}}, true);/*]]>*/</script>
Jangan lupa untuk mengganti kode publisher Adsense yang saya tandai dengan kode milik kamu sendiri.
Kode script diatas sudah upgrade menggunakan format auto ads yang baru. Jika mau yang lama, silahkan hapus saja bagian ad.setAttribute('crossorigin','anonymous');
Penjelasan
Selesai sudah. Silahkan kamu cek perubahaan performa website kamu di Google Pagespeed Insights atau GTMetrix.
Perhatikan bagian Javascript atau Script. Iklan dari Google AdSense sudah tidak terdeteksi dan tidak lagi jadi masalah dalam analytics performa website kamu.
Kenapa seperti itu? Silahkan kamu pahami bagaimana cara lazy-loading bekerja.
Cara kerja lazy-loading script
Untuk meringkas cara script lazy-load ini, saya akan jelaskan dalam poin-poin sebagai berikut:
- Script menunda pemuatan objek yang dituju dengan menunggu perintah trigger.
- Umumnya, perintah trigger adalah scroll layar sekitar 2-10% oleh pengunjung. Tapi ada juga yang menggunakan fungsi onClick ataupun onLoad sebagai triggernya.
- Dengan fungsi trigger scroll, jika pengunjung mengunjungi web kita tapi nggak scroll sedikitpun, maka objek-objek yang ditahan oleh lazy-load nggak akan termuat.
- Dan tentu saja analyzer seperti Google Pagespeed Insights dan GTMetrix tidak menggunakan fungsi scroll untuk menganalisa performa web kita. Oleh karena itulah, hasilnya sama seperti kita tidak memasang script Google AdSense.
- Karena orang yang nggak minat nggak akan scroll juga web kamu dan dengan begitu iklan kamu juga nggak akan tayang.
Apakah lazy-loading AdSense mempengaruhi CPM?
Ada beberapa yang bertanya tentang hal ini. Maka dari itu, saya tegaskan bahwa iya ini mempengaruhi CPM, jadi lebih baik. Kenapa? Karena dengan menggunakan trik ini, kamu bisa menghindari iklan kamu untuk tayang ke orang-orang yang nggak begitu minat ke web kamu.
"Karena orang yang nggak minat nggak akan scroll juga web kamu dan dengan begitu iklan kamu juga nggak akan tayang.
"Bukannya malah rugi? Untuk kehilangan 1 view dikatakan rugi itu tergantung kamu. Tapi untuk memperbaiki nilai Active View Viewable (Impression) di Google AdSense, ini akan sangat membantu.
Dengan trik ini, iklan kamu hanya akan tayang pada mereka-mereka yang bener-bener mengakses konten kamu dan berlama-lama di lama web/ blog kamu. Sehingga jumlah impresi aktif dan rata-rata iklan tayang di blog kamu juga meningkat.
Catatan: Namun, itu kembali ke kamu, mau impresi gede tapi active view viewable-nya kecil atau sebaliknya
Apakah lazy-load AdSense aman dari Banned?
Satu lagi pertanyaan yang sering muncul dari topik lazy-loading iklan AdSense adalah ini. Dan jawabannya sebenarnya bisa ditemukan di layanan support Google. Namun akan coba saya jawab secara singkat. Saya mengutip jawaban dari salah seorang perwakilan dari Google:
Seperti yang kamu bisa lihat dari jawaan di atas, lazy load AdSense bisa jadi aman dan bisa juga tidak tergantung bagaimana penerapannya. Jika penerapannya membuat iklan dari Google Ads terlihat mencolok, maka SEBAIKNYA JANGAN. Namun, jika iklan tetap tayang secara normal dan tidak terlalu merubah performa iklan, maka silahkan gunakan fitur lazy-load tersebut.
Penutup
Nah, mungkin gitu aja yang mau saya share tentang lazy-load AdSense ini. Semoga panduan ini bermanfaat dan bisa membantu kamu dalam memperbaiki performa kecepatan loading blog kamu. Jika ada yang ingin ditanyakan, jangan sungkan bertanya melalui kolom komentar di bawah. Sampai jumpa di konten selanjutnya.
Posting Komentar
Harap berikan komentar yang relevan dengan topik tulisan.
Jangan menyertakan link yang tidak berhubungan dengan konten tulisan. Apabila komentar mengandung link (apalagi yang tidak relevan), maka komentar akan dihapus.
Budayakan sopan santun, hindari penggunaan bahasa yang provokatif, SARA, pornografi.
Kritik dan saran yang membangun untuk konten ataupun untuk blog sangat berarti bagi kemajuan blog ini.