Date: 2017-07-17
Tags: python, sphinx, ogp

SphinxでHTMLにOGPタグ出力

  • SNSにURL投稿したらサイト内容が展開されるの、Sphinxにも欲しい。ちょう欲しい。

  • リンクだけとか寂しいしなんとかしたい。

  • 他のblogツール使ってる人がうらやましい。

ということで、Sphinx拡張を Python mini hack-a-thon 夏山合宿 の帰りの新幹線で実装しました。

実現したいこと

  • Twitter/FacebookへSphinxページシェアでサイトのコンテンツを埋め込みたい。

  • そのために、OGPに対応したメタタグをHTMLに埋め込みたい。

ソリューション

実装したSphinx ogtag拡張 の使い方とコードはこちら.

結果

../../../../_images/facebook.png

facebookに投稿したところ

それっぽい!これで俺のblogも人並みに!!

---

Twitterの方は、承認をもらうまで展開されないようなので、しばらく待ちます。

../../../../_images/twitter-validator.png

https://cards-dev.twitter.com/validator

おまけ: サイトがSNSシステムからどう見えているか

Slackにきれいに表示されるリンク先のページを見て、どんなメタタグが使われているか確認しました。インプレスさんのページは良い感じに見えてるのでこれをベンチマークに。

../../../../_images/slack-preview.png

http://pc.watch.impress.co.jp/docs/news/1048116.html

あと、Facebookのdeveloperコンソールが役に立ちました。Facebookはコンテンツ内容をキャッシュしてるので、実験中はこまめに再取得したりとかやりました。