【解決】AMP コンポーネントの「script」タグがありますが、使用されていません。

ブログ運営
この記事は約8分で読めます。

ずっとはまっていたのですが、解決できたため記事にしました。

参考になれば幸いです。

スポンサーリンク

発生したエラー

「AMP コンポーネントの「script」タグがありますが、使用されていません。」

Google Search ConsoleのAMPページにて検出されたエラーです。

AMP コンポーネントの「script」タグがありますが、使用されていません。

エラーの影響と解消の結果

エラーの影響

ページのAMPページがGoogleの検索結果に表示されなくなります。

解消の結果

ページのAMPページがGoogleの検索結果に表示されるようになります。

なおAMPページが検索結果に表示されるようになることにより、検索順位が変動したりコンバージョン率が変動するかどうかなどは今回は触れていません。

詳細な原因の調べ方

Google Search Consoleで表示された「AMP コンポーネントの「script」タグがありますが、使用されていません。」というエラーは大雑把すぎて対応方法が特定できません。

例えるなら、海原雄山にハンバーガーを試食してもらったところ

『こんなものは売り物にならん!』

とだけ、ダメ出しされた状態です。

バンズが駄目なのか、パテが駄目なのか、はたまたピクルスが駄目なのかさっぱりわかりません。より具体的な問題点を調べる必要があります。

山岡士郎に相談して何が駄目なのか教えてもらいましょう。(この例え、どれだけの人に伝わるのか!?)

『AMP テスト – Google Search Console』にアクセス

AMPテストとは、Googleが提供しているAMPページの検証用ページです。

ページ単位でGoogle Search Consoleよりも詳細に、AMPページを調べることができます。下記のページにアクセスしてください。

AMP テスト - Google Search Console

Googleで「AMP 検証」と検索しても出てくると思います。

「AMP 検証」とGoogle検索

エラーが発生しているAMPページを検証する

AMPテストのページの入力ボックスに、エラーが発生しているAMPページのURLを貼り付け「URLをテスト」をクリックしてください。

エラーが発生しているAMPページを検証する

その後、しばらく待ちます。(1分弱で終わると思います)

分析しています

詳細なエラー内容を確認する

表示されたページの『次の問題を修正してください。』の項目を確認してください。

Google Search Consoleよりも具体的な問題点が表示されていると思います。

拡張機能「amp-auto-ads」がこのページで検出されましたが、使用されていません。この拡張機能を削除してください。

今回の場合『拡張機能「amp-auto-ads」がこのページで検出されましたが、使用されていません。この拡張機能を削除してください。』というエラーが原因であることがわかりました。

これでGoogle Search Consoleのエラーより、具体的な内容を知ることができました。



対応方法

今回は『拡張機能「amp-auto-ads」がこのページで検出されましたが、使用されていません。この拡張機能を削除してください。』というエラーに対しての対応です。

このエラー以外だった場合は、別途エラーに応じた対応を行ってください。本ページの内容も少しは参考になるかもしれませんが別途調べることをおすすめします。

さて、今回のエラーで取りうる対応は2つ。

1.この拡張機能を削除する
2.この拡張機能を使用する

今回は「2.この拡張機能を使用する」という対応を行いました。

『拡張機能「amp-auto-ads」がこのページで検出されましたが、使用されていません。この拡張機能を削除してください。』とは

「amp-auto-ads」とはGoogleアドセンスの「AMP 自動広告」のためのライブラリです。

AMP自動広告

そのライブラリだけ読み込んで、使用してないよというエラーです。そのまますぎ?

説明します。

Webページで高度な処理を行う場合、以下のような手順を踏むことが多いです。

<高度な処理がしたい>
① ページにライブラリを読み込む。(htmlの<head>タグ内にライブラリを読み込むためのコードを記述)

② ライブラリから高度な処理の関数を呼び出し処理する。(htmlの<body>タグ内に関数を呼び出すコード記述)

例えるならこういうことをしています。

<美味しい肉ジャガが食べたい>
① 和食のレシピ本を図書館から借りてくる。

② レシピ本から肉ジャガのページを開き、レシピ通りに調理する。

そしてこの②が抜けているよ、というのがこのエラーという訳です。

せっかくレシピ本を借りてきたのに使ってないよ、そのレシピ本いらないんじゃない?返して来ちゃえば?というイメージです。

原因

Googleアドセンスの「AMP 自動広告」を設定するには、手順1の「ディスプレイ広告フォーマットをオンにします」という設定の他に2つの手順が必要です。

手順 2: このスクリプトをコピーして、AMP HTML の head タグ内に貼り付けます
手順 3: この広告コードをコピーして、AMP HTML の本文に貼り付けます

ところがその手順2しか行っておらず、手順3を行っていなかったのが原因でした。

AMP自動広告_3ステップ

 正直、身に覚えがありました。 

headタグはページ共通で読み込むためのプログラムを書き込む場所を知っていたので、さくっと貼り付けを行っていました。

ですがhtmlの本文に貼り付けとなると「えっ、全部のページに貼り付けるの!?めんどくさっ!」と思って、手順2だけ行って手順3を行っていませんでした。

はい、私が怠けたのが悪かったのです。

この手順2こそが「AMP自動広告のためのライブラリを読み込む」行為で、手順3が「ライブラリから実際に自動広告を表示する処理を呼び出す」記述だったわけです。
ちなみに急にエラーが大量に出てきたため、Googleの処理とテーマのアップデートで何かがうまくいってないのかなと思っていたのですが、そんなことはなく普通に自分のミスでした。

対応手順

概要

『手順 3: この広告コードをコピーして、AMP HTML の本文に貼り付けます』を行いました。

ただし1ページずつ貼り付けた訳ではなく「そのファイルにスクリプトを記述すると、すべてのページの本文にそのコードを挿入してくれるファイル」に手順3の広告コードを貼り付けました。

これは私が導入しているWordPressテーマ「Coccon」の機能です。

おそらく各テーマにもそのような機能はあると思います。

手順2のコードを削除する対応でもエラー自体は解決すると思います。
ただし、そうするとAMP自動広告は出ませんので注意ください。(まぁ、エラーの状態でもAMP自動広告は出ていなかったはずなので削除するという対応でも問題ありません。)

具体的な手順

ここからはテーマ「Coccon」での対応方法になります。

もし、他のテーマをご利用されている方は、そのテーマでの手順を調べて同じ対処を行ってください。

AMP自動広告の広告コードをコピー

Google AdSenseから広告コード取得します。

・[広告] → [自動広告]を開きます。

・[AMP自動広告]タブをクリックします。

・「手順 3: この広告コードをコピーして、AMP HTML の本文に貼り付けます」をクリックして展開し、[コードをコピー]をクリックしてコピーします。

広告コードはアカウント毎に異なります。必ずGoogle AdSenseに自分のアカウントでログインしてコードをコピーしてください。
「amp-body-top-insert.php」に広告コードを貼り付ける(全ページのbodyタグ内にコードを挿入する記述を追加する)

本作業はテンプレートファイルを編集して行います。
親テーマを編集して設定することもできますが、その場合はテーマの更新のたびに、再設定をする必要が発生します。この手順では子テーマを編集する想定の手順です。子テーマはこちらを参照

WordPressの管理者メニューのテーマの編集画面から行います。

・[外観] → [テーマエディター]を開きます。

・編集するテーマから「Coccon Child」を選択します。

・[tmp-user]を開き、[amp-body-top-insert.php]を選択します。

・<?php //ログインユーザーも含めてカウントする場合は以下に挿入 ?>の下に、広告コードを貼り付けます。

・[ファイルの更新]をクリックします。

WordPressにログインしているユーザーでアクセスした際はコードを挿入したくない、という場合は『//管理者以外カウントしたくない場合は//↓ここに挿入』という記述の下に貼り付けてください。
Cocconのテーマの編集については、こちらの記事が参考になりました。
なお、ページが破損している可能性があり、Google Chrome以外のブラウザで開いた場合はページが開けないかもしれません。
CocoonにAdSense AMP 自動広告を設定する方法
AdSense 自動広告は、通常ページに加えてAMP 自動広告があります。本記事では、WordPressのテーマCocoonの子テーマを編集してAMPページに自動広告を設定する方法を紹介します。Cocoon 0.3.1からAdSense自動
「修正を検証」をリクエスト

Google Search Consoleから[修正を検証]を行ってください。

以上で対応は完了です。

確認

Google Search Console、またはAMP テストからエラーが解消されているか確認してください。

エラーの解消は「検証をリクエスト」してすぐには確認されないため、数日待ってからエラーが減少していることを確認してください。

さいごに

以上となります。

本記事が誰かの役に立てば幸いです。

スポンサーリンク
スポンサーリンク

コメント

  1. こんにちは お陰様でAMPのエラー解決しました。下記のエラーがでて、困っていました。↓

    AMP コンポーネントの「script」タグがありますが、使用されていません。

    有難うございましたm(__)m

ブログ運営試行錯誤
もし参考になったらお友達にも教えてあげてください!
プカプカをフォローする

こんにちは、プカプカです。ふまじめなSE。
会社を辞めてフリーランスエンジニアになりました。今はSharePoint関係のお仕事やってます。Microsoft365勉強中。
ブログでは広大なネットの隙間を埋めるため試行錯誤の結果を共有していきます。

ふまじめSEの試行錯誤
タイトルとURLをコピーしました