HubSpotブログに「読了時間」を表示する方法

ブログ記事でよく見かける 「この記事は約〇分で読めます」 という表示。WordPressならプラグインで簡単に実装できますが、HubSpotのアセットマーケットプレイスには対応モジュールが見当たりませんでした。

そこで独自に調べた結果、以下の方法で実装できましたので共有します。

実装コード

{% set initialPostWords = content.post_body|striptags|length %}{% set calculatedPostWords = (initialPostWords/100) * 100 %}{% set finishedPostWords = calculatedPostWords|divide(400)|round(2) %}{% set number = finishedPostWords|round %}{% if number < 1 %}{% else %} <p class="post-reading-minutes">この記事は約 {{ finishedPostWords|round }} 分で読めます</p>{% endif %}
HTML

カスタマイズ方法

日本語の平均読書速度は 1分あたり400〜600文字と言われています。このコードでは 400文字/分 をデフォルト値として設定しています。

読む速さの基準を変えたい場合は、3行目の 400 を任意の数値に変更してください。

設定値想定する読者
400ゆっくり読む方向け(デフォルト)
500標準的な読書速度
600速読・慣れた読者向け

read next