GRAV の公式プラグインに Reading Time というのがあります。

GRAV Plugin Reading Time

たまに見かける「この記事を読むのにかかる時間は~分です。」みたいなことを実現するためのプラグインです。
無くてもまったく困らない機能ですが、あるとなんだかカッコイイ気がします(そうでもない?)。

ということでつけてみました( ゚Д゚)

 

使い方は簡単です。
使用しているテーマのテンプレートを編集して、所要時間を表示させたい箇所に

{{ page.content|readingtime }}

のコードを追加するだけ。

 

当サイトではBoostrap4テーマを使ってます。表示させたい箇所はBlog記事一覧のページなので

[gravインストール先]/user/themes/boostrap4/templates/partials/blog_item.html.twig

上記ファイルに追記することになります。

File: [gravインストール先]/user/themes/boostrap4/templates/partials/blog_item.html.twig
~~~
        {% if page.header.continue_link is same as(false) %}
            <p>{{ page.content|raw }}</p>
            {% if not truncate %}
                {% set show_prev_next = true %}
            {% endif %}
        {% elseif truncate and page.summary != page.content %}
            <p>{{ page.summary|raw }}</p>
            <p><a href="{{ page.url }}">Continue Reading...</a></p>
        {% elseif truncate %}
            {% if page.summary != page.content %}
                <p>{{ page.content|truncate(550) }}</p>
            {% else %}
                <p>{{ page.content|raw }}</p>
            {% endif %}
            {% if page.summary.enabled %}
                <p><a href="{{ page.url }}">Continue Reading...</a></p>
            {% endif %}
        {% else %}
            <p>{{ page.content|raw }}</p>
            {% set show_prev_next = true %}
        {% endif %}
~~~

 

各記事の概要が表示された場合に「Continue Reading...」のリンクが表示されるようになっているので、その横にReading Time を表示させ(追記し)ます。

File: [gravインストール先]/user/themes/boostrap4/templates/partials/blog_item.html.twig
~~~
        {% if page.header.continue_link is same as(false) %}
            <p>{{ page.content|raw }}</p>
            {% if not truncate %}
                {% set show_prev_next = true %}
            {% endif %}
        {% elseif truncate and page.summary != page.content %}
            <p>{{ page.summary|raw }}</p>
            <p><a href="{{ page.url }}">Continue Reading...</a><span class="float-right">{{ page.content|readingtime }}</span></p>
        {% elseif truncate %}
            {% if page.summary != page.content %}
                <p>{{ page.content|truncate(550) }}</p>
            {% else %}
                <p>{{ page.content|raw }}</p>
            {% endif %}
            {% if page.summary.enabled %}
                <p><a href="{{ page.url }}">Continue Reading...</a><span class="float-right">{{ page.content|readingtime }}</span></p>
            {% endif %}
        {% else %}
            <p>{{ page.content|raw }}</p>
            {% set show_prev_next = true %}
        {% endif %}
~~~

これで完了です。

 

サイトに戻って確認してみると、きちんと所要時間が表示されています。

が、

「0 minutes, 43 seconds」とか「0 minutes, 12 seconds」とかありえない時間が表示されちゃってます。

いやいやいや、いくら内容が薄い記事だからって秒で読めるとかないでしょうよ。 いじめか?泣くぞ(´・ω・`)

 

うーん、これはあれだ。たぶん日本語に対応してない(文字数とかのカウントが2バイト文字を考慮してない)とかその辺の問題じゃなかろうか。

ということで、プラグインの中身を確認しました。

File:[GRAVインストール先]/user/plugin/readtime/classes/TwigReadingTimeFilters.php
~~~

    $words = count(preg_split('/\s+/', strip_tags($content)) ?: []);

~~~

うん。完全に英語表記(もしくはそれに準じた言語)しか考慮されてないですね。

よし、なければ作る(もしくは改造する)。

File:[GRAVインストール先]/user/plugin/readtime/classes/TwigReadingTimeFilters.php
~~~

    //    $words = count(preg_split('/\s+/', strip_tags($content)) ?: []);
    $words = mb_strlen(strip_tags($content));

~~~

改造って程でもないですね。そのまんまですし(´・ω・`)。
ないとは思いますが、マルチバイト関連の関数(mb_で始まる関数)が使用しているphpに入っていない場合は使えません。

これで大体、正確な時間が表示されるようになりました。

 


Reading Time プラグインの設定項目に関して。

  • Plugin status (プラグインの有効・無効)
  • Words-per-minute(一分間に読む文字数、defultは200wpm)
    defultは200wpmですがこれは英語圏での設定です。日本語(日本人)の場合は一分間に500~600文字程度(もしくはそれ以上)と言われているので当サイトでは600に設定しています。
  • Format(所要時間表示形式)
  • Round to nearest(分と秒のどちらで丸めをおこなうか。defaultは秒。分を選ぶと秒数が四捨五入されて分のみの表示になる)
  • Include time for viewing images(画像をみる予想時間を所要時間に含めるかどうか)
  • Seconds to view images(画像を見るのにかかると思われる予想秒数の設定)

 

私の場合、記事内容を見て判断するタイプなので、どれくらいかかるかとかはあまり気にせず記事を開いてます。
なので所要時間の表示がどれほど需要があるのか微妙ですが、まあものは試しなので ( ゚Д゚)。

大した負荷ではなくてもページ生成過程で余分な処理が増えるので、将来的には外してしまうかもしれません。

ツイート いいんじゃね。と感じたらツイートしてもらえると喜びます。

Next Post Previous Post