ホーム » Webサイト » Googleアドセンス（Google Adsense）広告を遅延読み込み（LazyLoad）して表示速度を高速化する方法。

Webサイトコードスピードプラグインなし

Googleアドセンス（Google Adsense）広告を遅延読み込み（LazyLoad）して表示速度を高速化する方法。

ゴーキ

2023年11月13日

130 ビュー 0

お気に入りお気に入り削除しました 0

Googleアドセンスの読み込みはページ表示速度を著しく低下させます。

以下方法で問題解決の期待値が向上しますので是非お試しください。

Google AdsenseコードのScriptタグを削除

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8085372009702943"
     crossorigin="anonymous"></script>
<!-- フッター -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8085372009702943"
     data-ad-slot="2683573049"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

上記コードの下記部分を削除してください。

<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8085372009702943"
     crossorigin="anonymous"></script>
</script>

Scriptタグ削除後のコード

<!-- フッター -->
<ins class="adsbygoogle"
     style="display:block"
     data-ad-client="ca-pub-8085372009702943"
     data-ad-slot="2683573049"
     data-ad-format="auto"
     data-full-width-responsive="true"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>

遅延読み込み（LazyLoad）用コードを設置

下記コード導入で、スクロールしたタイミングで遅延読み込みをするようになります。

以下のコードを/body直前に設置してください。

<script>
//<![CDATA[
//lazy load ads
var lazyloadads = false;
window.addEventListener("scroll", function() {
    if ((document.documentElement.scrollTop != 0 && lazyloadads === false) || (document.body.scrollTop != 0 && lazyloadads === false)) {

        (function() {
            var ad = document.createElement('script');
            ad.type = 'text/javascript';
            ad.async = true;
            ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js';
            var sc = document.getElementsByTagName('script')[0];
            sc.parentNode.insertBefore(ad, sc);
        })();

        lazyloadads = true;
    }
}, true)
//]]>
</script>

以上、簡単な方法ですので是非お試しください。