AMPエラー『属性「loading」はタグ「amp-iframe」で使用できません。』を解決！【WordPress5.5】

属性「loading」はタグ「amp-iframe」で使用できません。を無事に解決できたので、AMPエラーの対処方法を共有したいと思います。

当サイトはWordPressの最新バージョン5.5以上、Gutenberg（グーテンベルク）で、有料のテーマ『THE THOR【ザ・トール】 』を使用しています。

他テーマをお使いの場合、手順に若干の違いがある場合があります。

この属性「loading」はタグ「amp-iframe」で使用できません。ですが、わたしはGoogelMapを記事内に埋め込んだときにAMPエラーが出ました。

前まではGoogleMapを挿入することでエラーが出ることなんてなかったのですが・・・どうやらWordPress5.5にバージョンアップした際に現れたエラーのようです。

この記事でわかること

属性「loading」はタグ「amp-iframe」で使用できません。の解決方法

属性「loading」はタグ「amp-iframe」で使用できません。はHTMLの中にある『loading=”lazy』に反応してエラーを出しています。

解決法は、『loading=”lazy』を消すだけなんですが、HTMLを入れるたびに『loading=”lazy』がないかチェックし、発見したら手作業で消す・・・のは、ちょっと効率が悪いですよね。


そこで、自動で『loading=”lazy』を消すためにfunctions.phpを編集していきます。

functions.phpへ入る

〈外観〉→〈テーマエディター〉を開き、画面右側の『編集するテーマ』で親テーマを選択します。

親テーマを選択したら『テーマのための関数（functions.php）』をクリックします。

functions.phpを編集する

『テーマのための関数（functions.php）』をクリックし、空いている欄に以下のコードを入力する。

『loading=”lazy”』を手動で消す方法

functions.phpをいじらなくても、loading=”lazy”を手動で消す方法もあります。

loading=”lazy”って何？

『loading=”lazy”』は記事を開くときに、記事内の画像を一括で開くのではなく、スクロールする際に画像を読み込むようにするコードで、WordPress5.5では自動的に挿入されるようになっています。

サイトスピードを上げるためのものですが、AMPは〈img〉タグの中に〈loding〉を使ってはいけないため、エラーになります。

ブログをやっている方のほとんどはサイトをAMP化している、AMP化に向けて動いていると思うのでAMPエラーは速やかに対処していきたいですよね。