少し前からSearch Consoleで「AMP HTML タグの属性で指定されたレイアウトが無効です。」のエラーに悩まされてました。が解決しそうです。
「AMP HTML タグの属性で指定されたレイアウトが無効です。」がプラグインで解決した件
このサイトはWordpressでやっていてAMP対応もしてるんですが、AMPの部分はテンプレートのSimplicityに頼っています。
ベータ版とのことなのですが、表樹のAMPのプラグインは結構デザインしょぼいので。
ところが少し前からGoogleのSearch ConsoleでAMPエラーが多発するようになりました。サイト管理者側だと検索結果でもこういう「このページにはAMP実装エラーがあります。」というエラー表示が出ます。
多発するＡＭＰエラー
これがSearch ConsoleのAMPエラーのグラフ。昨年末から急にエラーが増えています。また何もしてないのに1回減ってまた増えて・・・という状況です。
このAMPエラーって、Google側でAMPのコーディングの基準を都度変更しているのか、こちらで何もしてなくても急にエラーが増えたりするんで、結構面倒だなぁ・・と思ってほったらかしにしていました。Simplicityのバージョンアップで対応されたりするのかな・・・？とか。
けど検索結果に出てくるエラー表示は無視しづらいものもあって・・・。で、久々にこの一番多発している「AMP HTML タグの属性で指定されたレイアウトが無効です。」のエラーを再度見直してみました。
エラー部分をよく見ると・・・amp-iframeタグが引っかかっているようですが、さらによく見るとURLがamazon.co.jpとか・・・あれ？これって挿入しているAmazonJSがAMPで問題起こしてるってこと？と気づきました。
AmazonJS Reviewerをインストール
通りでこのエラーメッセージで検索しても同様の問題のソースが出てこないと思った・・・。Simplicityもかなりメジャーなテンプレートなので、こういう問題が出るとすぐに対応されたり、質問が来たりするはずなんですけど、それが皆無な理由はSimplicityのAMP×AmazonJS、というマトリックスで起こる問題だったから、なんですね。
ということで調べるとすぐに対応版の別プラグインを作られている方を見つけました。
AmazonJS という便利なプラグインがあります。
日本人の間では人気のあるアドオンなので知っている人も多いと思います。
このサイトのブックレビューで利用したくてカスタマイズを考えたのですが、少し調べてみると AMP仕様にして欲しいという要望が多かったので対応しておきました。
その名も AmazonJS Reviewer。
いやー、ありがたいですねー。このプラグイン、AmazonJSが入っている状態で利用する仕様だそうです。なのでこんな感じでインストール。
実際にＡＭＰエラーが解消したか確認
さて、Search Consoleで再度AMPの問題が解消したか確認してみます。とりあえずnginxのキャッシュをクリアして、エラーが出ていたURLの1つを再読込。キャッシュを生成しておきます。
Search Console側でURLを選択して「公開URLをテスト」すればそのURLを再クロールしてくれます。
指定されたURLをパースしてくれています。ドキドキ・・・。
お！問題ないことが確認されました！やはりAmazonJSのAMP対応に問題があったようで、AmazonJS Reviewerが解決してくれました。
サイト全体を修正検証
これでAmazonJSとAMPの問題が解決したようなので、今度はサイト全体の検証をSearch Console側で手配します。エラー項目のページで「修正を検証」をポチッとするとサイト全体のクローリングが始まります。
といってもその場で終わるわけではなく、とりあえず初期検証だけやってるみたい。
あとはしばらく待っていればAMPエラーの項目が1つ減ることになるのかな・・・？
