GitHub PagesのJekyllでogpタグを出力する

GitHub Pagesのドキュメントによるとjekyll-seo-tagというプラグインが使えるみたいです。

github.com

まず_config.ymlに以下の記述を追加します。

gems:
  - jekyll-seo-tag

それから_layouts/_default.htmlなどタグを出力したい位置に{% seo %}という記述を追加します。

<html>
  <head>
    {% include head.html %}
    {% seo %}
  </head>
</html>

とりあえずこれだけでサイトの設定や記事のデータに応じて必要最低限のタグは出力されますが、各ページや記事のヘッダ部分のYAMLにimage属性を記述しておくとog:imageタグを出力できます。

---
layout: post
title: "GitBucket 4.2 released!"
date: 2016-07-02 00:00:00
image: /images/gitbucket-4.2/adminlte.png
categories: gitbucket
---

他にもいろんな設定があるみたいなのでjekyll-seo-tagのREADMEを読んでおくとよいでしょう。

ちなみにjekyll-auto-imageプラグインを使うと記事中の画像ファイルのパスを自動的に取得できるのでogpやtwitterカードなどのタグを簡単に生成できそうですが、残念ながらGitHub Pagesでは使えないみたいです。

github.com