Livedoorブログで力技で目次を作成

[最終更新] 2016年11月16日

目次

1. Livedoorブログは目次の自動生成がない
2. 力技で目次を作成

Livedoorブログは目次の自動生成がない

Livedoor Wikiはcontentsと一文書けば目次が自動的に生成されるのですが、ブログサービスのはその機能はないようです。ブログといえども、必要な機能だと思うのですが…。タグ編集にしないと見出しの整理もままならないですし、少し構造的に記事を書きたいと思うと、Livedoorブログはなかなか難しいところがあります。まぁ、そもそもそういう層を狙っているわけではないのでしょうし、もし私も今ブログを始めるとすれば、Livedoorブログは選ばなかったろうと思います。手軽に始められるという点については、申し分ないのですが…。

力技で目次を作成

そうは言っても、現実問題としてどうしても目次が欲しい記事はあります。他に誰かやっている人はいないものかと色々調べていくと、JavaScriptを使って動的に作成している人もいたのですが、コピペでポンではうまくいかず、しかしJavaScriptについては不勉強なためにどこをどう治せばよいのかもわからず、自分の理解できないことはするものでもないだろうと、諦めました。動的作成は魅力的なので、いずれ勉強して実現したいところですが…。

JavaScriptを使わずに、htmlタグを用いたシンプルな方法もありました（「ブログの中に目次、表、枠などを入れる方法【テンプレートつき】 : 世界一周　絶景めぐり」）。なるほど、リンクタグを用いれば確実です。しかしながら、静的な方法であり、最初にテンプレートを作ってそこに埋めていくようにすればある程度実用的でしょうが、既に書いた記事についてこの方法で目次を作るのは、なかなかしんどそうです。

というわけで、スクリプトを組みました。使い方としては、シンプルエディタからタグ付きの本文をコピペしてテキストファイルを生成し、そのテキストファイルを引数にとって、書きRubyスクリプトを実行するような感じです。

gen-index.rb

#!/usr/bin/ruby
# coding: utf-8
def gen_index(file)
fp = open(file)
str = fp.read
fp.close
header = "<p>目次\n<ol>\n"
output = String.new
h2=0
h3=0
str.each_line{|l|
if /<h2>(.*)<\/h2>/ =~ l
h2 += 1
header << "</ol>\n" if h3 > 0
h3 = 0
header << "<li><a href=\"#h2-#{h2}\">#{$1}</a></li>\n"
output << l.sub('h2',"h2 id=\"h2-#{h2}\"")
elsif /<h3>(.*)<\/h3>/ =~ l
h3 += 1
header << "<ol>\n" if h3 == 1
header << "<li><a href=\"#h3-#{h2}-#{h3}\">#{$1}</a></li>\n"
output << l.sub('h3',"h3 id=\"h3-#{h2}-#{h3}\"")
else
output << l
end
}
header << "</ol>\n<\p>\n"
oname = file.sub(".txt","-gen.txt")
fout = open(oname,"w")
fout.puts header
fout.puts output
fout.close
end
file = ARGV[0].dup
gen_index(file)

使うとき

$ ruby gen-index.rb blog.txt
-> blog-gen.txt

結果、目次付きになってファイルが出力されるので、中身を改めてシンプルエディタでコピペして終わりです。この記事みたいな感じになります。

関連記事

スポンサーリンク