How to Lazy Load Adsense on WordPress, You may have noticed this every time you insert AdSense code into your WordPress, the website slows down significantly and displays a page speed warning know how to Reduce the impact of third-party code.
To fix this, you need the Google Adsense Lazy load code. lazy load
This script will significantly increase the speed of your site and make it a vital web core
friendly
So why did the speed drop after adding the Adsense code?
This is because Adsense is a third-party code that requires a lot of downloads.
file to display ads and has a lot of tracking codes. so if you paste the code directly on your site, it will block the loading of critical requests and slow down the page speed.
What is lazy loading?
Lazy loading is a technique for delaying the loading of a certain Javascript code and
those codes will only load after a user interaction such as page scrolling.
So instead of loading this heavy script to the top of the page, it delays
loading time and helps important resources load quickly.
Therefore, users no longer have to wait for the actual content to load in the browser. and the script will load once everything has been uploaded to the site.
You can enable lazy loading of images, Adsense code, analytics code, etc. in
Your place. In this post, we will see how to implement lazy loading Adsense on WordPress.
How to lazy load Adsense in WordPress
- To enable Lazy loading Adsense in WordPress, follow the steps below.
- Go to your WordPress dashboard and remove the existing AdSense tracking
code. - Now paste the following lazy loading code into the footer section.
- Then change your Adsense Publisher ID to this code and save the code.
- Adsense Lazyloading is now added to your WordPress site.
//<![CDATA[
var lazyadsense2 = false;
window.addEventListener(“scroll”, function(){
if ((document.documentElement.scrollTop != 0 && lazyadsense2 === false) || (document.body.scrollTop != 0 && lazyadsense2 === false)) {
(function() { var ad = document.createElement(‘script’); ad.setAttribute(‘data-ad-client’,’ca-pub-xxxxxxxxxxxxxxxxx’); ad.async = true; ad.src = ‘https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js’; var sc = document.getElementsByTagName(‘script’)[0]; sc.parentNode.insertBefore(ad, sc); })();
lazyadsense2 = true;
}
}, true);
//]]>
</script>
Here, please note that you will see Javascript code in all manual ad unit codes that
must be removed. Otherwise, your Lazy loading script will not work correctly.
Lazy Load WordPress using the Perfmatters plugin
If you are using the Perf Matter plugin, you can enable the lazy loading of WordPress easily.
- Just go to Perfmatters settings> Assets and enable Javascript delay choice.
- Now under Delay Behavior select “only differ defined scripts” choice.
- Now in the “Pending Script” box, paste the provided code and save it to Settings
Adsense lazy loading will now work perfectly on your WordPress site. There is no need to add the manual slow load script.
You can also use plug-ins like WP-Rocket and Litespeed cache plug-in
delay the loading of the Adsense code
