こんにちは。司法書士の廣澤です。
わかりにくいエラー解除の記事が乱立しており、意味不明なエラーを前にして、大切な時間を失っていませんか?
先ほど、AMPエラーが解決できたので、アフィンガー5を利用している方向けに、その方法をご紹介しておきます。
まず検証用に、AMPテストページのタブを出しておきましょう。
エラーが出ているURLをコピペすることで、有効になったかすぐにこちらのページで確認できます。
早速、エラーを解消していきましょう。
まず、サーチコンソールで、左下のAMPページを開きます。
許可されていない属性または属性値がHTMLタグにあります
AMPページの中から「許可されていない属性または属性値がHTMLタグにあります」と記載されているエラーをクリックします。
すると、エラーがあるURLがでてくるので、どれでもいいのでクリックします。
そうすると、次のような原因が表示されます。
属性「loading」はタグ「amp-img」で使用できません。
属性「decoding」はタグ「amp-img」で使用できません。
これらのエラーについては、アフィンガーの場合、親テーマのfunctions.php(外観→テーマファイルエディター→アフィンガー親テーマを選択→functions.php)の一番下に下記コードを貼るだけです。
function apm_no_lazy_loading(){
if(amp_is_amp())
add_filter( 'wp_lazy_loading_enabled', '__return_false' );
}
add_filter( 'amp_initialized_filters', 'apm_no_lazy_loading' );add_filter( 'post_thumbnail_html', 'remove_loading_attribute', 10 );
アフィンガーURL
私の場合は、なぜかこれだけだとダメだったので、追加CSS(子テーマ)に次のコードを貼ることで解決しました。
add_filter( 'wp_lazy_loading_enabled', '__return_false' );
これでAMPが有効になりました。ここまでに休日の1時間を使いました…。
原因についてですが、もともとの画像の属性が、wordpressのアップデートによって利用できなくなったという、これも、よくわからない理由のようです。上記コードによって、利用できない属性を消すとのこと。エラーが治りさえすれば、原因はどうでもいいですね!
AMP HTML タグの属性で指定されたレイアウトが無効です。
必須属性「height」がタグ「amp-img」にありません。
このエラーは上記のエラーとは違って、記事の中の画像が小さすぎるのが問題のようです。なので記事の中にある小さい画像を大きくしてみた結果、有効になりました。
まとめ
上記の対応でエラーはなくなりましたが、画像が消えるなどの問題は残ります。
場合によってはAMPへの対応はさせないというのも一つの方法かと思います。
以上、参考になれば幸いです。
この記事が役に立ったという方はワンクリックのご協力 よろしくお願いいたします。↓↓