AdSense（アドセンス）新コードの遅延読み込み2つの方法

数年前より、この遅くなってしまうグーグルアドセンス（Google AdSense）のJava Scriptの遅延読み込みコードの方法が紹介されています。

多くはインドの以下サイトのコードを</body>直前に挿入すつ方法がひとつです。

//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)

上記コードにても今の所表示されます。

しかし、新コードになりより高速になったので上記コードを少しだけ追記編集することにより実現可能になります。

上記のコードのオプション部分のcrossorigin = 'anonymous';とご自身の?client=ca-pub-◯◯◯◯◯◯◯◯の部分のca-pub-以降の数字もデフォルトで追記されました。

上記のアドセンスの新コードによる遅延読み込みコードの方法ですと、以下のようになります。

方法1アドセンス新コード対応遅延読み込みコードスクリプト

//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.crossorigin = 'anonymous';
ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-◯◯◯◯◯◯◯◯◯';
var sc = document.getElementsByTagName('script')[0];
sc.parentNode.insertBefore(ad, sc);
})();

lazyloadads = true;
}
}, true)

上記の赤い部分を新コードに対応させるべく記入位置と記入内容を上記のようにします。

※pub-以降の◯◯◯◯◯◯◯部分はご自身の数字に置き換えてください。

そして、themeの</body>直前に挿入します。

あとは、サイト内の<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-◯◯◯◯◯◯◯◯" crossorigin="anonymous"></script>をすべて削除します。

１つでも残っていますと、表示はされますが、ページ表示速度が著しく低下もしくは低評価になってしまうことです。

なので、サイト内のグーグルアドセンス（Google AdSense）のそれぞれの広告コードの、

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

をすべて削除します。

次にアドセンス新コードの遅延読み込みコードの方法2です。

多くのサイトで上記方法1の遅延読み込みコードと以下の遅延読み込みコードの方法が記載されています。

 

<script>
(function(window, document) {
function main() {
// GoogleAdSense読込み
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);
}

//遅延読込み
var lazyLoad = false;
function onLazyLoad() {
if (lazyLoad === false) {
// 複数呼び出し回避 + イベント解除
lazyLoad = true;
window.removeEventListener('scroll', onLazyLoad);
window.removeEventListener('mousemove', onLazyLoad);
window.removeEventListener('mousedown', onLazyLoad);
window.removeEventListener('touchstart', onLazyLoad);
window.removeEventListener('keydown', onLazyLoad);
main();
}
}
window.addEventListener('scroll', onLazyLoad);
window.addEventListener('mousemove', onLazyLoad);
window.addEventListener('mousedown', onLazyLoad);
window.addEventListener('touchstart', onLazyLoad);
window.addEventListener('keydown', onLazyLoad);
window.addEventListener('load', function() {
// ドキュメント途中（更新時 or ページ内リンク）
if (window.pageYOffset) {
onLazyLoad();
}
//何もアクションがないときは指定秒数後に読み込み開始（ミリ秒）
window.setTimeout(onLazyLoad,3000)
});
})(window, document);
</script>

 

方法1、方法2のどちらも内容としては、サイトが表示されただけでは読み込みませんよ。マウススクロールやマウスを動かした後や画面にタッチしたなどのユーザの行為の後にアドセンスのJava Scriptコードを読み込みますよ。

という内容の意味になります。

これだけでも問題はないのですが、それだとアドセンスのJava Scriptが読み込まれないので何も起こりません。

それでも良いのですが、赤い部分を追加することにより表示3秒後に強制的にJava Scriptを読み込みますよいう意味内容のコードを追記しています。

この方法2の場合でも古いアドセンスコードであれば問題はないのですが、上記のように新しいアドセンスの新コードには、

?client=ca-pub-◯◯◯◯◯◯◯◯" crossorigin="anonymous"></script>

が追加されています。

 

よってこちらの新コードを正確に遅延読み込みさせるには、これまでになかった上記コード部分を追記する必要があります。

追記した遅延読み込みコードが以下のようになります。

<script>
(function(window, document) {

function main() {
// GoogleAdSense読込み
var ad = document.createElement('script');
ad.type = 'text/javascript';
ad.async = true;
ad.crossorigin = 'anonymous';

ad.src = 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-◯◯◯◯◯◯◯◯◯◯';
var sc = document.getElementsByTagName('script')[0];
sc.parentNode.insertBefore(ad, sc);
}

// 遅延読込み
var lazyLoad = false;
function onLazyLoad() {
if (lazyLoad === false) {
// 複数呼び出し回避 + イベント解除
lazyLoad = true;
window.removeEventListener('scroll', onLazyLoad);
window.removeEventListener('mousemove', onLazyLoad);
window.removeEventListener('mousedown', onLazyLoad);
window.removeEventListener('touchstart', onLazyLoad);
window.removeEventListener('keydown', onLazyLoad);

main();
}
}
window.addEventListener('scroll', onLazyLoad);
window.addEventListener('mousemove', onLazyLoad);
window.addEventListener('mousedown', onLazyLoad);
window.addEventListener('touchstart', onLazyLoad);
window.addEventListener('keydown', onLazyLoad);
window.addEventListener('load', function() {
// ドキュメント途中（更新時 or ページ内リンク）
if (window.pageYOffset) {
onLazyLoad();
}
//何もアクションがないときは指定秒数後に読み込み開始（ミリ秒）
window.setTimeout(onLazyLoad,3000)
});
})(window, document);
</script>

以上、アドセンスの新コードの遅延読み込みにするには" crossorigin="anonymous"と?client=ca-pub-◯◯◯◯◯◯◯◯"に2つをどこにどのように追記すれば良いのかわからない時は、

上記コードのように赤い部分に新たに加わったアドセンスの新コード2つを追加することにより、遅延読み込みコードを実現することができるようになります。

何度かページスピードインサイト（PageSpeedInsight）にて、分析（測定）してみた結果、ある程度のバラツキはあるものの当サイトでは2倍以上の評価になりました。過去最高値でした。

以下参照です。

 

 

PCの場合ですと以下のような結果になりました。

あとは、少しでも早くするために以下コード（DNSプリフェッチ）をhead内に追記すると少しは効果があるかもしれません。

直接header.phpに記載する場合は以下になります。

<link rel='dns-prefetch' href='//ajax.googleapis.com'/>
<link rel='dns-prefetch' href='//lh3.googleusercontent.com'/>
<link rel='dns-prefetch' href='//pagead2.googlesyndication.com'/>
<link rel='dns-prefetch' href='//googleads.g.doubleclick.net'/>
<link rel='dns-prefetch' href='//adservice.google.co.jp'/>
<link rel='dns-prefetch' href='//adservice.google.com'/>

function.phpに以下コードを追記すると、自動的にhead内に追加されます。

//DNSプリフェッチ

function add_resource_hints( $hints, $relation_type ) {
if( is_single() ){
if ( 'dns-prefetch' === $relation_type ) {
$hints[] = '//lh3.googleusercontent.com';
$hints[] = '//pagead2.googlesyndication.com';
$hints[] = '//adservice.google.co.jp';
$hints[] = '//adservice.google.com';
$hints[] = '//googleads.g.doubleclick.net';
}
}
return $hints;
}
add_filter( 'wp_resource_hints', 'add_resource_hints', 10, 2 );

参考サイト）

GoogleAdSenseの遅延読込みでページ表示速度を改善

GoogleAdSenseの読込みの遅さを改善する。 問題点と目標 問題点 GoogleAdSenseは、JavaScript/画像/フォント/設定ファイルなどの複数データを読込むため、非常に低速です。そのため、広告を導入したページは、広告のないページに比べてページ表示速度が低速...

バグ取りの日々

AdSenseの広告を遅延表示させてスコア改善とページ表示スピードを高速化

AdSenseの表示を速くしたいのであえて遅延表示？！ AdSenseの広告を表...

QWERTY.WORK

あなたにおすすめ

WordPress カスタマイズ 伝えたいこと 備忘録

ショートコード作り方テンプレートから呼び出す方法などいろいろ

ショートコードって学べば学ぶほど色々な活...

WordPress テーマ

Stinger6からStinger5にしてみた。

WordPress4.4でStinger...

WordPress カスタマイズ テーマ 備忘録

AFFINGER5でプラグインなしで機能制限なくクレジット削除方法

WordPressで人気なテーマのひとつ...

伝えたいこと 備忘録 時事ネタ 治療

ロキソニンに継ぎタミフル、メマリーなど新たな重篤な副作用が発覚この2年間で。

以前にも薬の副作用についてお話しましたが...

伝えたいこと 備忘録 時事ネタ

池上彰氏参院選に続いて都知事選で池上無双炸裂か！！

池上彰さんと言えば、もう知らない人はいな...

伝えたいこと 備忘録

おすすめの電気シェーバーBrownシリーズ9と洗浄液

日々の朝のルーチンワークのひとつに男性と...

Windows10サポート終了まで

Multiplex 広告

【AmazonタイムセールSALE車＆バイク】！

人気の商品が日替わりで登場。毎日お得なタイムセール「Amazonタイムセール全体」

人気の商品が日替わりで登場。毎日お得なタイムセール

年金倍増で日本経済は大復活する!デフレの終わり、第二の「高度成長」の始まり

¥2,463 （2025/05/22 19:48時点 | Amazon調べ）

Amazon

楽天市場

Yahooショッピング

メルカリ

ポチップ

エクストレイルT32おすすめバッテリーPanasonicカオスバッテリー

すべての車でバッテリーが搭載されています。特にアイドリングストップ車以降現在主流になりつつある電気自動車などではバッテリーの性能がとても重要になってきます。今回は日産エクストレイ

📅 2020.11.14 | 📂 メンテナンス, 車

バッテリー交換後の廃バッテリー処分方法3つ

バッテリー交換は、どの車においてもいずれは発生する事象です。新車で購入して3年で乗り換えなんて言う方は今ではそんなに多くはないと思います。（中に入ると思いますが、多くの方々はそれ

📅 2023.08.06 | 📂 メンテナンス, 車

あなたが訪問してから

⏰ 0 秒経過 🎉

入学入社まであと…入学入社祝いはどんなPresent（プレゼント）でどのように過ごされますか？

ホワイトデープレゼントは以下などの豊富なキャンペーン商品から選ぶと良いと思います。

今週の人気記事トップ１０

• 車のキーナンバー確認方法。キーレス紛失や壊れた時 19件の PV

• アイドリングストップシステム異常警告灯表示対処方法 13件の PV

• カーメイトのエンジンスターターでエラー15表示と対処方法 12件の PV

• エクストレイルT32運転席側バイザーメッキモール剥がれ修復方法とオススメ両面テープ 11件の PV

• ECUをリセットする方法。アイドリング不安定だったのでしょうがなく 10件の PV

• エクストレイルに後付けクルーズコントロール取り付けプロパイロットもどき 8件の PV

• ナビテレビが見れなくなった時ICカードが正常に動作しませんでした対処方法 7件の PV

• エクストレイルT32で電動レカロをバッ直でなく車に取り付ける方法 6件の PV

• シガーライターがない車にシガーライターソケットの付け方と増設方法 6件の PV

• アルミテープチューン貼る場所で燃費向上と走行性能アップTOYOTAの特許を試してみた 6件の PV

ブログサービスが始まってから:

カウントダウンタイマー

おすすめの記事一部広告