Octopressで見出しの目次を作る方法 改

以前このような記事を書きました。

Octopressで見出しの目次を作る方法 - 割り箸ポテチ

この記事を読まれた方から、より良い方法を教えて頂きました。

Octopressで見出しタグを目次にする方法 - Qiita

jekyll-toc-generatorというjekyllのプラグインを修正して使う方法です。
修正する理由は下記で解説されています。
jekyll-toc-generatorを個別ページで表示する場合の問題点 - MBA-HACK2

rdiscountの見出し作成機能を使わず、フィルタで本文をパースして見出しを構成してしまうというアプローチでした。
勉強になりました。その手があったか。

で、試してみたところ概ね自分の望むとおりに動いていました。素晴らしいです。

ただ一点だけ、<!-- more -->excerptで後半を省略する場合に、
カレントページへのアンカーのままだとリンク先が省略されて意図した動作をしなくなるので、
オプションで絶対パスを指定できるようにして使うことにしました。(あとatomに載った場合も困る)

修正した後のコードは下記です。

https://github.com/KawaharaTaisuke/jekyll-toc-generator/commit/18fbd3be566304a566bb2209b3189262a2bf892a

page_urlオプションでページの絶対パスを指定できます。
source/_includes/article.htmlの修正例は下記の通り。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# source/_includes/article.html

# (snip)

{% raw %}
{% if index %}
<div class="entry-content">{{ content | toc_generate page_url: post.url | excerpt }}</div>
{% capture excerpted %}{{ content | has_excerpt }}{% endcapture %}
{% if excerpted == 'true' %}
<footer>
<a rel="full-article" href="{{ root_url }}{{ post.url }}">{{ site.excerpt_link }}</a>
</footer>
{% endif %}
{% else %}
<div class="entry-content">{{ content | toc_generate page_url: post.url }}</div>
{% endif %}
{% endraw %}

広告