WordPress での AMP化でエラーとなる原因の一つが判明

Googleによるサイト内検索

現在運用中のサイトのテーマは「Simplicity2」を使用していますが、「Simplicity2」のカスタマイズ機能に備わっている「AMP(β機能)」については時々試しているものの、毎回エラーが発生するため、殆ど諦めていましたが、記事の少ない一つのサイトでAMP化の設定をしてみたところ、エラーなく成功しましたので、エラーで失敗するサイトと、エラーなく成功するサイトの環境を比較しながら試してみた結果、エラーとなる原因の一つが判明しましたので、参考になればと思って、メモを公開にしました。

AMP化の設定とエラーの状況

「Simplicity2」のカスタマイズには「AMP(β機能)」の設定がありますので、時々「有効化」して試してみました。

しかし、何回試してみても下図のようなエラーが表示され、失敗してしまいます。

「検証の問題」を見ますと、

</div><link rel=”stylesheet” href=”https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css”>

と書かれていますが、素人の私には理解できず、その都度、諦めていました。

原因は、プラグイン「WP Fastest Cache Premium」の設定にありました

2018年12月22日のことですが、一つのサイトで AMP化を試みたら、下図のように表示され、AMP化は成功。

続いて、最も AMP化したいサイトを試してみたら、やはりエラー。

AMP化に成功する場合と、エラーとなる場合の環境の違いを調べてみました

AMP化に成功するサイトがあるし、失敗するサイトがあると言うことは、同じテーマ「Simplicity2」を使いながらも、設定されている環境に違いがあるはずだと、カスタマイズの内容を比較しましたが差異は無し。

インストールして有効化されているプラグインを比較したら、

AMP化に失敗しているサイトには、「WP Fastest Cache Premium」を使用しており、

AMP化に成功しているサイトには、「WP Fastest Cache」を使用しています。


WP Fastest Cache Premiumの設定画面を開いて、WP Fastest Cacheと異なるところを活かしたり殺したりしてテストを繰り返し、ついに、エラーとなる原因を発見することが出来ました。


下図はWP Fastest Cache Premiumの設定画面です。

「WP Fastest Cache Premium」の設定画面で「Render Blocking Js:」のチェックを外して Off にする

あれこれと試しているうちに、「WP Fastest Cache Premium」の設定画面でRender Blocking Js:」のチェックを外して Offにしたら、AMP化でエラーが発生しないことが判りました。

チェックを外して Offにした結果は、

全てのサイトで「AMP(β機能)」を「ON」にする

一件落着です。

現在活きている全てのサイトの「AMP(β機能)」を「ON」にしました。