Theme Naked Blog

Nakedのカスタマイズを紹介するブログ

Nakedの目次を番号リストでなく、箇条書きリストにする方法

テーマNakedでは、目次が既にデザインされています。

しかしいろんな方から、リストは番号表示でなく、一般的なリスト表示にしたい!との声をいただきました。正直、この部分はカスタマイズしておくべきではなかったかなと反省しています^^;。

なのでリスト表示に戻す方法を記事にしたいと思います!

実装図

実装図はこんな感じです。

f:id:ftmaccho:20160626141509j:plain

番号リストから、一般的なリスト表示に戻しました。

カスタマイズ

実際にカスタマイズは、「デザインCSS」に、

ul.table-of-contents {list-style-type: disc;}
ul.table-of-contents > li > ul {list-style-type: circle;}
ul.table-of-contents > li > ul > li > ul {list-style-type: disc;}

と入れてみてください。

以上でカスタマイズは終了です。

cssの一行目が大見出し、二行目が中見出し、三行目目が小見出しに対応しており、discが黒丸、circleが白丸となります。その他のデザインにしたい場合は、

www.htmq.com

などを参考に書き換えてみてください。