less than 1 minute read

Jekyll にカテゴリ一覧とタグ一覧のページを追加する で作成したタグ覧ですが、ソートするようにしました。

やり方

tags.html を修正します。差分 (を VScode で表示したコード) は以下の通り。

diff

まず、

{% for tag in site.tags %}

とシンプルにタグをそれぞれループしている箇所を、すべてのタグを | で連結し、それを split で分割したうえで sort コマンドで並び替えて tags 変数にセットしています。一度連結したうえで分割してソートしているのでわかりにくいですが、Jekyll だとこうしないと処理できない、のだと思っています。 そのうえで、変数 tags でループすることで、並び替えたタグ順で表示することが可能です。そのため、上の画面で言えば 7 行目の sort しているあたりで並び方を調整することが可能であれば、任意の順番で表示させることも可能に思えます。ただ、アルファベットの大文字小文字を無視したソートはできず、大文字でソート ⇒ 小文字でソートの順番になってしまいます。

また、site.tags は配列1つ目にタグ名、2つ目にそのタグの記事が格納されていますが、追加した変数 tags はタグ名が入っているだけです。そのため、修正前は tag[0] で取得したタグ名は tag で、tag[1] で取得した記事一覧は site.tags[tag] で取得するように変更しました。

これで、以下のようにタグ名がソートされます。

diff

一覧としては見やすくなりましたが、やはり数が多いので、スクロールするのが大変です。タグの一覧と、そのタグがついた記事の一覧は別々に表示するなどして、より見やすくする工夫が必要に感じました。

更新日時: