WordPressのAMPプラグイン(バージョン1.0)を使ってみた ※デモあり
はじめに
つい先日、WordPressのAMP公式プラグインのバージョン1.0安定版が正式リリースされました。
筆者もベータ版から触ってみているのですが、かなりの完成度です。
もう数ヶ月先にはAMPプラグインを入れただけでWordPressサイトのAMP対応は完了。
AMP化に必要な工数はほとんどなくなり、今度こそ世界中のサイトがAMP化するのではないかと思います。
ですが、現時点ではまだプラグインで対応しきれていない部分もちらほら。
そこで現状でどこまでできるのか、デモ環境を公開させていただこうかと。
エンジニアの皆様のご参考になれば幸いです。
デモ環境&元のサイト
実際に存在するサイトを元にデモ環境を作りました。
ぜひ見比べて見てください。
デモ環境:http://stg-spc.net/demos/amp/wp/
※全ページAMP化済み
元のサイト:売れるECサイトの 企画・構築・運用ならECサイト制作.com
URL構成に関して
まず気にすべきはURLです。
ベータ版では、従来通り通常ページのURLに「/amp」をつける形でAMPページが生成されるわけではなく、「?amp」をつける形もしくは「通常ページをAMPページに置き換える」という形になるようです。
見つかった不具合
ただ、以下の点で表示崩れ・動作不良が見つかりました。
・これまで通りオリジナルJavaScriptが動かない(ハンバーガーメニューやスクロールに合わせて出てくる要素など)
・プラグインを使用した問い合わせ機能が動かない
・チャットボットやMAツールなどは動作しない
・WordPressの場所がドメイン直下出ない場合は背景が表示されなくなる(CSSのディレクトリ指定がずれる)
やはりJavaScriptまわりがネックなようですね。
おわりに
もうちょい、といったところでしょうか。
アップデートが楽しみです。
AMPに関しては他にも記事を執筆しております。
この記事にたどり着いた方々には訳に立つ内容ではないかと。
- 『AMP公式ページを読んでも分からないこと|ホームページ制作、Webマーケティング|株式会社SPC』
- 『AMPページに『Google Analytics』を設置する際の禁止事項』
- 『AMPページを作る際の工数を削減してみた(WordPress)』
※全てバージョン1.0が出る前の記事となります
3つ目の記事に関しては、今後必要なくなってしまいますね。
色々工夫したのに……。
追記していかねば。