【AMPエラー解消】タグ「amp-img」の属性「width」に無効な値「」が設定されています。

以前ワードプレスのAMP対応でエラーが出たという記事を書いたけど、これはワードプレスのプラグイン設定がおかしかった。

hydro-pump.hatenablog.com

問題

<header class="container">
  <div id="headerwrap">
      <div id="header">
                <div class="amp-logo">
  
                  <a href="http://〇〇?amp=1"    >

                <amp-img src="http://〇〇" width="" height="" alt="〇〇" class="amp-logo" layout="responsive"></amp-img>

          </a>
         </div>
                       </div>
  </div>
</header>

<amp-img src="http://〇〇" width="" height="" alt="〇〇" class="amp-logo" layout="responsive"></amp-img>

上記の部分でタグ「amp-img」の属性「width」に無効な値「」が設定されています。のようにエラーが出ていたので直そうと思って、ワードプレスのコードを漁っていたんだけど、該当箇所がわからねえ・・どこにこのコードあるんだ状態だった。

だけど、AMP対応するときにプラグインを2点入れたんですよね。

• AMP

• AMP for WP – Accelerated Mobile Pages

っていうやつです。 AMP for WP – Accelerated Mobile Pagesというプラグインの存在を忘れ、AMPプラグインのコードを読んでそれっぽい箇所がないかと時間の無駄になる作業をしていた・・ampのドキュメント読む前にやることあったよ・・・

該当箇所見つからないしおかしいなあとは思っていたんだけど、まさかプラグインの存在を忘れ、そのプラグインが問題の該当箇所を担っていたとは。自分がどんな作業をしたのかは覚えていないとダメですね。

問題解決

タグ「amp-img」の属性「width」に無効な値「」が設定されています。

この部分が示しているコードはロゴ画像のwidthなので、それを設定しているAMP for WP – Accelerated Mobile Pagesの設定画面を見ます。

こんな簡単なところでロゴ画像を設定していた。 PCの方でもロゴ画像はつけていないので、amp化されたHTMLでもロゴ画像は設定しない。

「Remove」で画像を外す。

再度SearchConsoleからテストを実行！さあこい！！

おk。