Banyak pemilik blog mengeluhkan penurunan kecepatan loading situs mereka setelah memasang iklan. Hal ini sangat wajar karena script iklan membutuhkan waktu ekstra untuk memuat berbagai elemen dari server luar. Namun, Anda tidak perlu khawatir karena ada solusi cerdas yang bisa diterapkan, yaitu menggunakan metode penundaan pemuatan iklan atau yang sering disebut sebagai lazy load. Panduan ini akan menunjukkan cara mengimplementasikan metode tersebut agar blog Anda tetap melesat cepat tanpa harus mengorbankan potensi penghasilan dari iklan.
Mengenal Script Penunda Iklan
Script lazy load adalah serangkaian kode JavaScript ringan yang berfungsi untuk menahan pemuatan script utama iklan sampai pengunjung benar-benar mulai berinteraksi dengan halaman blog. Interaksi ini bisa berupa guliran layar ke bawah, gerakan mouse, atau sentuhan pada layar ponsel. Dengan cara ini, peramban web pengunjung bisa fokus memuat konten utama seperti teks dan gambar terlebih dahulu.
Manfaat Utama untuk Blog Anda
Manfaat paling terasa dari penerapan kode ini adalah peningkatan skor kecepatan blog secara drastis di alat pengujian kecepatan situs. Kecepatan loading yang optimal merupakan salah satu faktor penting dalam optimasi mesin pencari, sehingga posisi artikel Anda berpotensi meningkat. Selain itu, pengunjung akan merasa lebih nyaman membaca karena tidak perlu menunggu lama, yang pada akhirnya dapat mencegah mereka menutup halaman Anda secara tiba-tiba.
Contoh Penerapan di Halaman Blog
Bayangkan seorang pengunjung membuka artikel Anda. Pada detik pertama, hanya teks dan gambar utama yang dimuat, membuat halaman langsung bisa dibaca dalam sekejap. Ketika pengunjung tersebut mulai menggulir layar ke bawah untuk membaca paragraf selanjutnya, barulah script iklan bekerja di latar belakang dan menampilkan banner promosi pada ruang yang sudah disediakan. Pengalaman membaca menjadi sangat mulus tanpa jeda yang mengganggu.
Kode Lengkap Siap Pakai
Berikut adalah kode JavaScript yang telah dioptimalkan untuk menunda pemuatan iklan. Anda hanya perlu menyalin kode di bawah ini. Pastikan Anda mengganti teks yang berisi deretan huruf X dengan ID Publisher milik Anda sendiri.
<script type='text/javascript'>
//<![CDATA[
var lazyadsense = false;
window.addEventListener("scroll", function(){
if ((document.documentElement.scrollTop != 0 && lazyadsense === false) || (document.body.scrollTop != 0 && lazyadsense === false)) {
(function() {
var adScript = document.createElement('script');
adScript.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-XXXXXXXXXXXXXXXX';
adScript.async = true;
adScript.crossOrigin = 'anonymous';
var headNode = document.getElementsByTagName('head')[0];
headNode.appendChild(adScript);
})();
lazyadsense = true;
}
}, true);
//]]>
</script>Panduan Pemasangan Langkah demi Langkah
Langkah pertama, pastikan Anda sudah menghapus semua pemuatan script iklan bawaan yang biasanya berakhiran adsbygoogle.js dari dalam template maupun widget Anda. Sisakan hanya tag penempatan unit iklannya saja.
Langkah kedua, masuk ke dashboard akun Blogger Anda. Pilih menu Tema yang berada di bilah navigasi sebelah kiri, kemudian klik ikon panah kecil di samping tombol Sesuaikan, dan pilih opsi Edit HTML.
Langkah ketiga, cari tag penutup body di dalam kode template Anda. Anda bisa menggunakan fitur pencarian di dalam editor dengan menekan tombol kombinasi di keyboard, lalu ketikkan </body> pada kolom pencarian untuk menemukannya dengan cepat.
Langkah keempat, letakkan atau tempelkan kode lazy load yang sudah Anda salin tepat di atas tag </body> tersebut. Jangan lupa untuk memastikan ID Publisher sudah diubah sesuai dengan identitas akun Anda.
Langkah terakhir, simpan perubahan template Anda. Silakan buka blog Anda dan gulir halamannya untuk menguji apakah iklan sudah muncul dengan sempurna sesaat setelah layar digulirkan.
Cara Menguji Keberhasilan Pemasangan
Setelah menanamkan kode di atas, langkah krusial berikutnya adalah memastikan bahwa semuanya telah bekerja sesuai rencana. Anda bisa melakukan pengujian ini dengan sangat mudah tanpa memerlukan alat analisis kecepatan pihak ketiga.
Silakan buka alamat blog Anda menggunakan mode penyamaran (incognito) di peramban web. Saat halaman pertama kali terbuka tanpa Anda melakukan sentuhan apa pun pada layar atau tetikus, perhatikan ruang kosong tempat iklan biasanya muncul. Jika ruang tersebut kosong, itu adalah pertanda sangat bagus. Selanjutnya, mulailah menggulir layar ke bawah secara perlahan. Jika iklan baru bermunculan seketika saat Anda menggulir halaman, maka selamat, kode penunda pemuatan iklan Anda telah berfungsi dengan sempurna.
Kesalahan Umum yang Harus Dihindari
Dalam mempraktikkan tutorial modifikasi template Blogger, ada beberapa kesalahan kecil yang sering membuat script gagal berfungsi secara maksimal. Mari kita bahas hal ini agar Anda terhindar dari kendala teknis.
Membiarkan Script Iklan Bawaan
Kesalahan yang paling sering ditemui adalah membiarkan script default dari jaringan periklanan tetap berada di dalam template atau di dalam widget HTML. Jika kode pemanggil iklan bawaan masih tersisa, peramban pengunjung akan tetap memuat iklan sejak detik pertama. Akibatnya, fungsi kode penunda yang baru saja Anda pasang menjadi tidak berguna. Anda harus teliti dalam menyisir dan menghapus semua script lama tersebut.
Penempatan Kode yang Kurang Tepat
Struktur template Blogger sangat sensitif terhadap perubahan. Memposisikan kode JavaScript di tempat yang salah dapat membuat template menjadi rusak atau memunculkan pesan error saat Anda mencoba menyimpannya. Pastikan Anda menempelkan kode persis di atas tag penutup body, bukan di bawahnya atau terselip di dalam tag pembungkus lainnya. Kerapian penempatan kode adalah kunci keberhasilan sebuah tutorial.
Penutup
Semoga panduan dan tutorial cara memasang script lazy load AdSense di Blogger ini bermanfaat dan dapat langsung Anda praktikkan untuk meningkatkan performa situs Anda. Jika Anda memiliki pertanyaan atau mengalami kendala saat menerapkan kode di atas, jangan ragu untuk berdiskusi melalui kolom komentar di bawah. Ikuti terus blog ini untuk mendapatkan update tutorial, tips, dan trik menarik lainnya seputar dunia blogging dan optimasi website. Selamat mencoba!