3 configs add recommend articles into your Hugo blog by GitHub Actions

Tue, 25 Jan 2022 19:37:52 -0800

Hugo has a feature to show keyword based related articles.

Yeah, keyword based articles might be useful, for people who can manage keyword, category, etc, constantly. I’d love to add content based recommendation that doesn’t require to write explicit keywords by myself. Then, I found an open source named “Prelims” which is developed by takuti.

Prelims is a post-processing tool for Front matter of Hugo/Jekyll, that is a metadata of an article. The recommendation method which is implemented for now is classical, create a TF-IDF based word vector and find similar articles by consign similarity.

The reason why I love Prelims is it’s simple and flexible. Post-processing of front matter doesn’t break your articles nor blog system at all. You can remove extra meta data Prelims generated whenever you want.

Isn’t it practical, right?

One downside of Prelims is it requires to implement Python code for tokenizing or vectorizing TF-IDF. I don’t want to bring my laptop for blog writing and wanna use Netlify CMS and iPad without having Python environment.

So, I built a CLI tool for Prelims, named prelims-cli, which enables to add recommended articles just writing 1 configuration YAML file. It also runs with GitHub Actions.

The three things you need to prepare are:

Configuration YAML file for prelims-cli. e.g., scripts/config/myconfig.yaml
Hugo HTML partial layout, e.g., layouts/partials/page_related.html
GitHub Actions workflow for prelims-cli

Here is the example gist what you need to write.

where content/blog is the directory for English articles and content/post is the directory for Japanese articles.

Putting three files enables you to show recommended articles into your Hugo blog, like the screenshot in the top of this article.

Internally, for Japanese tokenization, it uses SudachiPy. Since keywords prelims generates are a-bit noisy and didn’t wanted to cleanup, so I stopped using it.

The good things I feel are, I can use my blog articles for my hobby recommendation project, and I don’t need to manage tags and categories seriously.

You can enjoy your recommendation without having Python environment, so you can write your articles on iPad with Netlify CMS!

3ファイル追加してGitHub ActionsでHugoにレコメンド記事を表示する

Tue, 25 Jan 2022 18:41:33 -0800

こんにちは、早いものでもう40の大台が迫ってくる誕生日を迎えました。前日にブースターショットを打ったので、一日中ほとんど寝込んでいました。必要な人のために、例のリストを置いておきます。

さて、Hugoにはキーワードベースの関連記事の表示をする機能があります。

しかし、キーワードベースの関連記事も悪くはないのですが、折角なので自分で関連記事のレコメンドをしてみたくないですか？そう思っていたら、 takuti さんの Prelims というオープンソースを見つけました。

Prelimsは、Hugo（やJekyll）のFront matterと呼ばれるメタデータの部分にキーワードやレコメンド記事を足してくれるものになります。

レコメンドの方式自体は、今実装されているのは古典的なTF-IDFを用いたコンテンツベースの類似文書を出してくる方式ですが、Front matterを後から処理してレコメンド記事を追加するというシンプルだけどスマートな方法に感銘を受けました。

ただし、Prelimsはflexibilityを重視しているため、例えば日本語のtokenizerやstop wordsなどは自分で設定をする必要があります。

このあたり、ちょっと慣れていないと難しいかなとも思ったので、prelims-cliというCLIツールを作り、config用のYAMLファイルを用意すればGitHub Actionsでrecommendできるようにしました。

用意するものは以下の3つです。

prelims-cli用の scripts/config/myconfig.yaml
関連ページを表示する layouts/partials/page_related.html
prelims-cliを実行する GitHub Actions

実際の例をgistに貼りました。

myconfig.yaml については、 content/blog が英語の content/post が日本語の記事をおいている想定です。この3つのファイルを追加すればHugoであれば関連記事が、冒頭の画像のように出てくるはずです。

内部的には日本語のtokenizerはSuachiPyのfull辞書を使い、最も長いCモードで形態素単位を設定しています。ただし、prelimsが生成する keywords は少しノイジーだなと思ったので、自分のサイトでは recommendations のみを利用しています。

僕はものぐさなので、タグやカテゴリを豆にメンテナンスできないのですが、レコメンドのおかげで過去の関連記事のリンクも出せるので便利だと感じています。また、自分の記事は自分の持ち物なので、それに対してレコメンドしてML的なsandboxとして遊ぶのは楽しいなと感じています。

この環境を使うことで、Netlify CMSでの執筆等Python環境を用意することができないところでも執筆して、レコメンド記事を作成することができます。もしよければ、 prelims を使ったレコメンドを試してみてください。

ML | Democratizing Data

3 configs add recommend articles into your Hugo blog by GitHub Actions

3ファイル追加してGitHub ActionsでHugoにレコメンド記事を表示する