このサイトはJekyllで作成しています。
Jekyll本体の使い方も書こう書こうと思って書けていませんが、AMPに関することだけさくっとまとめておきます。

JekyllでAMPページを出力する

方法は2つあります。

  1. サイト本体をAMP対応させる
  2. サイト本体とは別にAMPページを出力する

1. サイト本体をAMP対応させる

Amplifyという専用テーマがあります。
これを元にデザインをカスタマイズしても良いし、AMP StartAMP Templatesで配布されているテーマをJekyll用に改造しても良い。

だたしこの方法は、スクリプトなどを多用しているサイトには不向きです。
サイト全体をモバイルファーストにして、複雑なギミックなどはすべて捨てる覚悟が必要。

2. サイト本体とは別にAMPページを出力する

私は本体のデザインが捨てがたかったので此方を採用。
この場合は、amp-jekyllというプラグインを導入します。gemでインストールすることもできます。

これは指定したフォルダにAMP対応ページを別途出力してくれるプラグインです。
URL構造は通常ページのに指定したディレクトリ名が付きます。(WordPressのAMPプラグインだと最後にディレクトリやクエリがつくので逆です。)

付属のAMPページ用テンプレートはカスタマイズ前提なのでご注意ください。
先のセクションで紹介したテンプレートサイトから好きなのを持ってきてJekyllのレイアウトファイルにしてしまうのが簡単だと思います。

AMPが正しく動くかチェック

AMPは一つでもエラーがあるとGoogleがキャッシュしてくれず、検索結果には表示されません。(通常ページが表示されます。)
生成後は必ずAMPBenchでエラーがないかチェックしましょう。

スポンサーリンク