JekyllからPelicanへ切替

Posted on 2020年12月30日 (水) in articles

年末は時間ができるため、毎年システムのアップデートや必要に応じて切替と言った作業をおこなっているのだが、今年はこのBlogシステムを稼働させているサーバのOSのアップデートは早々に終わってしまった。(FreeBSD 12.1から12.2へのアップデートだったため。)

何事も無く平穏な年末か・・・と思っていたら、そうもいかず・・・ と言うのが今回の話である。

前回の変更は2020年1月12日の記事に詳しいが、これなんだかんだ年末にやっていたのである。前回はアップデートが非常にスムーズで、サクッと終わったので、ようやく安心して記事が書けると思っていたのだが、これもツールの組み合わせに敏感なようで、Ruby 2.6から2.7に切り替えたあたりで実は動かなくなってしまったのである。(正確にはサーバ上で作業ができなくなっただけで、WSL2やMacの上ではできる。)

Jekyllをうちの環境で使っている場合には、いつもEventMachineのネイティブライブラリのコンパイルが通らなくて、前回はたまたま運良くうまくいっただけなのであった。さすがにこれだけに振り回されるのも厳しいし、Jekyll自体は処理が軽いとは言えないので、まあ潮時か・・・ (今ファイルが約1700個くらいあるので、サーバ上でたぶんサイト全体を生成するのに5分くらいかかる。)

今回は広く色々みていこうと思い、JavaScriptのNext.jsGatsbyHexoGridsomeあたりをみてみたのだが、うちの環境ではlibvipsがインストールできなくて、これを使うsharpがインストールできていない。そのためHexo以外はことごとく使えないという。これはそのうち解決せねばと思う。(どうもGlib2のバージョンアップをしないといけないのと色々グラフィック関係のライブラリを入れないと・・・ということで、ちょっとめんどくさすぎる。) ただ今回の休みでどうこうと言う気にはなれなかったので、いったんJavaScriptの方向はやめた。

他どうかとSite Generatorを眺めていたら、JavaScriptでもRubyでもGo(Goの処理系入れてない)でもないところで・・・Pythonと言う路線があったかということで、Pelicanを選択してみた。

今回の作業の要点は

  • Python 3.7で使えればしばらく安心だろう。
  • Markdownで書いた記事の見直し
  • 複数のTagを付けている物の体裁を整える(括弧やクォートを外す)
  • 画像のALTが入っていない物は可能な限り入れる

と言うところか・・・ テーマはいったんFlexを使うことにする。

インストールの方はこんな感じである

% python3 -m pip install "pelican[markdown]"
% python3 -m pip install typogrify
% git clone --recursive https://github.com/getpelican/pelican-themes
% git clone --recursive https://github.com/getpelican/pelican-plugins

ここからはBlogの生成作業環境の作成である。

% mkdir blog
% cd blog
% pelican-quickstart
Welcome to pelican-quickstart v4.5.3.

This script will help you create a new Pelican-based website.

Please answer the following questions so this script can generate the files
needed by Pelican.


> Where do you want to create your new web site? [.]
> What will be the title of this web site? Kentaro's Room
> Who will be the author of this web site? Kentaro OGAWA
> What will be the default language of this web site? [ja]
> Do you want to specify a URL prefix? e.g., https://example.com   (Y/n)
> What is your URL prefix? (see above example; no trailing slash) https://dabesa.org
> Do you want to enable article pagination? (Y/n)
> How many articles per page do you want? [10]
> What is your time zone? [Europe/Paris] Asia/Tokyo
> Do you want to generate a tasks.py/Makefile to automate generation and publishing? (Y/n)
> Do you want to upload your website using FTP? (y/N)
> Do you want to upload your website using SSH? (y/N) y
> What is the hostname of your SSH server? [localhost] 
> What is the port of your SSH server? [22]
> What is your username on that server? [root] kentaro
> Where do you want to put your web site on that server? [/var/www]
> Do you want to upload your website using Dropbox? (y/N)
> Do you want to upload your website using S3? (y/N)
> Do you want to upload your website using Rackspace Cloud Files? (y/N)
> Do you want to upload your website using GitHub Pages? (y/N)
Done. Your new project is available at /home/kentaro/src/pelican

%

という感じに対話的に設定が進む。実際のユーザー名や公開時のファイルの置き場は適当に読み替えること。処理の結果このようなTreeができあがる。

blog
├── Makefile
├── content
├── output
├── pelicanconf.py
├── publishconf.py
└── tasks.py

contentディレクトリにBlog記事の元になるMarkdownファイルを入れ込めば良いので・・・ 実際にやるとこういう風になる。

blog
├── Makefile
├── content
│   ├── articles -> /path/to/articles
│   ├── asset
│   ├── gallery -> /path/to/gallery
│   ├── pages
│   └── photos -> /path/to/photos
├── output
├── pelicanconf.py
├── publishconf.py
└── tasks.py

こんな感じである。

あとは設定の要点だけ・・・

まずはURL関係。

ARTICLE_URL = 'posts/{date:%Y}/{date:%m}/{slug}/'
ARTICLE_SAVE_AS = 'posts/{date:%Y}/{date:%m}/{slug}/index.html'
MONTH_ARCHIVE_URL = 'posts/{date:%Y}/{date:%m}/'
MONTH_ARCHIVE_SAVE_AS = 'posts/{date:%Y}/{date:%m}/index.html'
YEAR_ARCHIVE_URL = 'posts/{date:%Y}/'
YEAR_ARCHIVE_SAVE_AS =  'posts/{date:%Y}/index.html'

SLUGIFY_SOURCE = 'basename'

こんな感じなのだが最後の行でSLUGIFY_SOURCEをbasenameにしておく。これは上のURLの設定でslugと設定しているところでtitleに設定した値に置換されるのだが、日本語を含む場合ローマ字読みなのかなんののか、かなりカオスな文字列になるので、ファイル名を使った方が無難だろうと言う設定である。

次にテーマ関係。Themeは先にpelican-themesのレポジトリのcloneをしたので設定したいディレクトリを設定。

THEME = '../pelican-themes/Flex'
PATH = 'content'
STATIC_PATHS = [
  'asset',
  'gallery',
  'photos',
#  'articles', # mixed content
]
ARTICLE_PATHS = [
    'pages',
    'articles',
]

PATHで処理を行うディレクトリを設定(ここはデフォルトのまま)、STATIC_PATHSに設定した物は今あるままでそのまま出力して欲しいディレクトリを設定。ARTICLE_PATHSではHTMLに変換をかけて出力したいディレクトリ(要はMarkdownファイルを入れたディレクトリ)を指定する。

日付の設定は言語をjaに設定(これは最初の設定で入力している)した場合は、以下のようにして変更できる。

DATE_FORMATS = {
    'ja': '%Y年%m月%d日 (%a)',
}

SNS関係の設定は

# Social widget
SOCIAL = (
  ('twitter', 'https://twitter.com/hogehoge'),
  ('facebook', 'https://www.facebook.com/hogehoge'),
  ('instagram', 'https://instagram.com/hogehoge'),
  ('flickr', 'https://www.flickr.com/photos/hogehoge/'),
  ('tumblr', 'https://hogehoge.tumblr.com/'),
  ('500px', 'https://500px.com/hogehoge'),
  ('github', 'https://github.com/hogehoge'),
  ('envelope', 'mailto:hogehoge@example.org'),
)

みたいな感じにしておけば良い。アイコンの名前とURLを組みにして書けば良いのだが、アイコンの名前はFont Awesomeの名前で良さそう。

あとは数式を表示するために以下の設定を行っている。

PLUGIN_PATH = '/home/kentaro/src/pelican-plugins'
PLUGINS = [
  'render_math',
]

render_mathTypogrifyが必要ということなので、最初にpipで入れておいた。設定はこれだけで、今まで書いてきた数式はそのまま表示されている。

残件は

  • Style関係
  • フォントを見直したい (旧フォーマットくらいにはしたいが、Adobe Fontsを使えるようにするしか無いか)
  • 配色の見直し
  • 幾つか死んでしまっているリンクの見直し

と言うところである。あとはのんびりやるしか無い。この記事は新環境で書いたので、ここからまた気が向いたら記事を書いていこうと思う。