GoogleサーチコンソールでAMPエラー出まくりでした。正しくAMPを実装しているかどうか検証できる方法をお伝えします。
WordPress「Cocoon」には、Cocoon設定>管理者画面 で、「AMPエリア表示する」にチェックを入れると、簡単にAMPをチェックできるバナーが現れます。
Google AMPテスト
サイトはこちら
「Cocoon」だと、WordPressにログインした状態で、自分の投稿したページを開いて、下部の「Google AMPテスト」をクリックするとこのページに飛び、検証してくれます。
もしくは投稿した記事のURLの末尾に「?amp=1」を付け、検証をします。Googleの提供するツールですが、Googleアカウントの所有やアカウント作成は必要ありません。
AMPページが正常な場合は「有効なAMPページです」と表示されます。
異常がある場合は「有効なAMPページではありません」、AMPページへのリンクが設定されていない場合は、「AMPページではありません」と表示されます。
The AMP Validator
サイトはこちら
AMP Validatorは、AMPプロジェクトが提供するAMPテストツールです。「Cocoon」だと前述の「Google AMPテスト」同様、下部の「The AMP Valodator」をクリックするだけで自動的にサイトに飛び、検証してくれます。
Chromeの拡張機能にもあるので、Chromeウェブストアからインストールも可能です。
AMPのサイトのURLを入れ、「VALIDATE(検証)」をクリック。OKの際はPASSと表示されます。
エラーの際は「赤のびっくりマーク」で表示されます。アイコンをクリックすると具体的なエラー場所がハイライトで表示されるため、修正箇所がどこなのか、わかりやすいです。
Google Search Console
サイトはこちら
Googleサーチコンソールで検証を行なうには、登録が必要です。Cocoonでの登録方法はこちらをご覧ください↓

左側の 拡張>AMP をクリックすると、対象Webサイト内の全てのAMPページが検証されます。
んん〜〜ひどい。「詳細」を見ると、どこがいけないかを教えてくれます。
Chrome搭載のAMP HTMLのページソースが確認できるツール
Chrome 右上の三つの点をクリック>その他のツール>デベロッパーツール をクリックします。
ショートカットキーでも開きます。
WINDOWS | Ctrl+Shift+i |
---|---|
MAC | Command+Opt+i |
AMPのサイトを開き、「Elements」→「Console」をクリックします。
AMPページが正常であれば「Powered by AMP」の表示が出ます。
「Cocoon」だと、投稿したページのAMPサイトも「AMPページへ」を押すだけ、ワンクリックで表示されます。
表示したらショートカットキーでデベロッパーツールを出すだけなので、とても簡単です。