AMPのエラーの対応になんか追われています・・・。
AMPエラー対応：タグ「style amp-custom」内のテキストに「CSS i-amphtml- name prefix」が含まれていますが、これは許可されていません。
このサイトのAMPエラーをちょいちょい直しているのですが、またなんか新しいエラーが出てきました。今度のエラーはこれ。
急に出てきたエラー、ということは最近やった変更か何かが悪さしているはず。とりあえずエラーメッセージで検索するとこちらのページが出てきました。
つまり「<style amp-custom></style>」内に書けるCSSは50,000Bytes(バイト)＝50KB(キロバイト)までなんですね。
あー。AMPエラー修正ついでに通常ページとAMPページの見栄えを近づけるためにプラグイン周りのCSSをごそっとamp.cssに追加したなぁ、そういえば・・・。
AMPは独立した別ファイルのCSSを使えないため、このサイトで利用しているテーマ、simplicityではテンプレートファイルの中にあるamp.cssに追加したいCSSを指定します。それをテーマ側でampの中にincludeする、という仕組みなんですが、その追加CSSの量が多いためにこのエラーが出た、という感じですね。
AMPエラーの修正開始
Search ConsoleのAMPの修正の読み込みは対象ページが多いほど時間がかかるので、とりあえず1ページだけ修正してそれでAMPチェックがOKなら全適用する、ということで、ChromeのAMPデバッグ、AMPのURLに#development=1をつけて確認をします。
Search Consoleで開発者ツールを開くといきなりこのエラーが出るんですよね・・・・。
「このコンソールを使用すると、攻撃者があなたを装ってSelf-XSSと呼ばれる攻撃を使用してあなたの情報を盗むことができます。あなたが理解できないコードを入力したり貼り付けたりしないでください。」
これって大丈夫なのかなぁ・・・？
修正して1ページだけチェック
今回のエラーがホントにCSS指定の容量だけであれば発生しているエラーは一発で解消するはずなので、amp.cssからごそっとCSS指定を外してテストします。
Search ConsoleのAMPチェックからURL1つを選択して虫眼鏡をクリック。
一旦はインデックスされているAMP htmlをチェックしに行ってしまいます。当然エラーです。
エラー表示を確認したら右上に見えている「公開URLをテスト」して初めて修正反映のテストができます。
じっと待つこと・・・・どれくらいだろ？
お、OKですね。やはりCSS指定の総量の問題のようでした。
なので全体反映させるために元の一覧ページに戻って・・・。
「修正を検証」をクリック。これで初期検証をした上で問題なければ実際のインデックスの修正確認に入ります。
結構時間かかるのでいつ頃反映されるのかな・・・？
