WordPressのAMPプラグイン、1.5系はバグってる？

2020年4月4日WebサイトWordPress

このブログでは、AMPプロジェクトが公開しているWordPressプラグイン「AMP」を使用して、モバイル向けの軽量ページを提供しています。

ふとGoogle Search Consoleを見たところ、先月末からAMPページのエラーが多数出ていて、調べたところAMPプラグインの1.5系が悪さをしていそう、ということが分かりました。

経緯

昨日、Google Search Consoleを見たところ、3月31日からAMPページのエラーが出ているのに気づきました。（画像右端で赤いグラフ（エラーのあるページ数）が急増している）

AMPページのエラーが出ている

サーチコンソールの「URLの検査」を見ると、問題の内容は「許可されていない属性または属性値が HMTL タグにあります。」とのことです。（HMTLはHTMLの誤記？）

「許可されていない属性または属性値が HMTL タグにあります。」エラー

GoogleのAMPテストで詳細なエラーを確認してみると、内容はどれも

タグ「IMG-I-AMPHTML-INTRINSIC-SIZER」の属性「src」に無効な値「data:image/svg+xml;charset=utf-8,<svg height="237" width="648" xmlns="http://www.w3.org/2000/svg" version="1.1">」が設定されています。

という内容でした（height、widthはものによって異なりました）。

imgタグのsrcがおかしいみたい

当該のHTMLを抜き出してみると、下記のような内容です。

<img alt aria-hidden=true class=i-amphtml-intrinsic-sizer role=presentation src="data:image/svg+xml;charset=utf-8,<svg height="237" width="648" xmlns="http://www.w3.org/2000/svg" version="1.1">">

確かに、AMPテストのエラーの通り、src内に画像アドレスでないものが書かれています。

AMPプラグイン以外、すべてのプラグインをオフにしても状況が変わらなかったので、AMPプラグインに問題があるのだろうと思っています。（AMPプラグイン1.5.0のリリースが3/31ですので、それとも整合します）

また、GitHubを見ると、同様の問題が上がっているようです。

とりあえずの対策

前述のGitHubのやりとりを見ると、2020/4/4に公開された1.5.2で修正されたらしいですが、試したところ変わらずでした。

また、1.5.0や1.5.1でも同様だったので、1.4系の最終バージョンである1.4.4にダウングレードしました。

ダウングレードする方法

Jetpackなどでプラグインの自動アップデートをしている人は、AMPプラグインの自動アップデートを無効にしておきましょう。

AMPプラグインの詳細ページから、以前のバージョンをZIP形式でダウンロードできますので、これを手元に保存しておきます。

WordPressのプラグインページからAMPプラグインを停止して削除します。

「プラグインを追加」から「プラグインのアップロード」を選択し、先ほど保存したAMPプラグインをアップロードしてインストールすれば完了です。

当面は旧バージョンで過ごしたいと思います。

追記：2020/4/10

バージョン1.5.0について

バージョン1.5.0は、WordPressの再利用ブロックをすべて消してしまうバグがあるようです。ダウングレードする場合、1.5.0を入れないよう気をつけてください。このバグは1.5.1で修正されています。

バージョン1.5.2とW3 Total Cacheの組み合わせについて

AMPプラグイン1.5.2とW3 Total Cache（HTMLのMinify）を同時に使うと、これまたAMPテストで失敗するようです。

上記の「1.5.2でも直ってなかった」というのは、正しくはW3TCのせいでした。

W3TCをお使いの方は、HTML minifyを無効にするか、Never minify the following pagesに「amp」と足すか、他のキャッシュプラグインへの乗り換えが必要です。

（追記：2020/5/1）W3TC 0.13.3で、AMPプラグインとの組み合わせで起きていたバグは修正されたようです。

（さらに追記：2020/8/4）プラグインをたくさん入れすぎて相性問題を起こすと面倒なので、現在当ブログではAMPプラグインの使用をやめて、AMPに対応したテーマ「Luxeritas」に移行しました。

WebサイトWordPress

Posted by 管理人：astherier