Liquidのforループの中で降順の番号をつける方法

タグ: #jekyll #markdown

2019年7月31日時点での情報なのでの私の理解なので、もっといい方法があったら更新します。


Introduction

Jekyll+Github Pagesで公開しているページのなかで、Liquidの for ループを使って業績一覧を作っていました。業績一覧といえば、最新の業績が一番上に来て、降順で並べるのが普通だと思います。それに伴って、番号も下から上に増えていって、最新の業績が何個目なのかを知ることができます。

目標としてはこんな感じです。

[3] 業績3つ目
[2] 業績2つ目
[1] 業績1つ目

データとしてその業績が何個目なのかを入れておけば良いのだと思うのですが、業績の記載を忘れていたりして追加したときに、それ以降の番号を手動で修正しないといけなくなったらかなり面倒だと思います。

for ループもそうですが、JelyllではLiquidが使えます。数を数えるくらいできそうなので実装してみようと思います。


Methods and Results

forループの復習

このブログの最新記事5つのタイトルを出力してみます。

コード


{% for post in site.posts limit:5 %}
<p>{{ post.title }}</p>
{% endfor %}


結果

Microsoft Teamsでサインインできているかを確認する

論文メモ

Binder et al. PLoS Pathogens 2013

【R tips】formatC()を使って論文に必要な有効数字3桁を取得する

【R tips】テキストファイルで準備したデータをread.csv()で読み込む

for post in site.post では日付の新しい順に記事を取ってきます( limits:5 は初めの5つに限定するためのフィルタです。)。

このforループの中で全記事中の何番目なのかを示すために以下のようにします。

コード


{% assign test_post_num = site.posts | size %}
{% for post in site.posts limit:5 %}
<p>[{{ test_post_num | plus: test_dec_var }}] {{ post.title }}</p>
<div style="display: none">{% decrement test_dec_var %}</div>
{% endfor %}

結果

[18] Microsoft Teamsでサインインできているかを確認する

-1

[17] 論文メモ

-2

[16] Binder et al. PLoS Pathogens 2013

-3

[15] 【R tips】formatC()を使って論文に必要な有効数字3桁を取得する

-4

[14] 【R tips】テキストファイルで準備したデータをread.csv()で読み込む

-5

一行目の {% assign test_post_num = site.posts | size %}test_post_num に総記事数を入れています。

{% decrement test_dec_var %} は読まれるたびに1ずつ減っていきます。読まれるたびに出力されるので <div> タグで囲って style="display: none" として見えないようにしています。


{{ test_dec_var2  }}
{% decrement test_dec_var2 %}
{% decrement test_dec_var2 %}
{% decrement test_dec_var2 %}

-1
-2
-3

{{ test_post_num | plus: test_dec_var }}とすることで、総記事数に1ずつ減っていく数を足して、降順に減る番号を実装しました。


Discussion

decrement では最初に現れたときに -1 になるので、forループの最後で更新するようにしています。また、ループの最初は何も入っていないのですが、 plus: としても問題はありませんでした。

この方法だと、ループごとに使う変数を管理する必要があるので、間違えて被ってしまったときに変な数字が出てしまうと思います。また、 style="display: none" となっていて、生成されるhtmlファイルもみにくくなります。もう少し管理の楽な方法で実装したいです。