WordPressをAMPに対応する方法。固定ページも。

WordPressで作成した企業サイトをAMP対応することがあったのでメモ。

「AMP」プラグインをインストール

インストールするだけでWordPressで構築したサイトをAMPに対応できます。
インストールしたら有効化すれば終わりです。

https://ja.wordpress.org/plugins/amp/

AMPのページはURLがそれ専用となります。

  • 通常のURL
    • http://hogehoge.jp/test/
  • AMP化した表示
    • 末尾に /amp/ をつける
      • http://hogehoge.jp/test/amp/
    • または 末尾に &amp=1 をつける
      • http://hogehoge.jp/?p=1234?amp=1

これで完了。

「Facebook Instant Articles & Google AMP Pages by PageFrog」プラグインをインストール

AMPプラグインとFacebook Instant Articles & Google AMP Pages by PageFrogプラグインを併用すると固定ページもAMP対応ができます。さらにロゴを変えたり、フォントの色を変えたりといったちょっとしたカスタマイズができるようになるのでおすすめです。

インストールしたら有効化しましょう。
有効すると、AMPを先にインストール済みなので、Google AMP HTMLがReadyになっているはずです。

そして「Mobile Formats > Settings」メニューへ
Setting for published post で投稿と固定ページにチェックが付けられます。
AMP対応を希望するページにチェックを入れましょう。もちろん両方チェックを入れるのも可能です。


Enable AMP のボタンをクリックし最後にSave All Settingsをクリック。これで AMP 対応が完了となります。

AMP対応のページにアクセスしてみましょう。

AMPが正しく設定できているかを確認

Googleの構造化データテストツール「Structured Data Testing Tool」にアクセスします。


https://search.google.com/structured-data/testing-tool

AMP対応したページのURLを入力してテストを実行してください。
結果が表示されます。

AMPの表示をカスタマイズ

Facebook Instant Articles & Google AMP Pages by PageFrogをインストールするとサイドメニューに下図のようなMobile Formatsというメニューが表示されていますので、このなかのStylingを選択します。

すると以下のようなページが表示されますのでこちらでロゴ画像を選択したりフォントや文字色を選択することができます。

Save Settingsをクリックして保存すれば完了です。

スポンサーリンク

シェアする

  • このエントリーをはてなブックマークに追加

フォローする