Table of Contents Plus の目次をレスポンシブと番号の有無に対応させたカスタムCSSサンプル

WordPressで記事や固定ページを投稿した際に、本文の見出し(H1〜H6)タグの数と構造に応じて自動的に目次を作成し表示してくれる、もっともポピュラーなプラグインといえば 「Table of Contents Plus」。 デフォルトでは、以下のようなシンプルな味気ないデザインですが、プラグインの設定でデフォルトのCSSを無効にして、よりデザイン性の高い独自のスタイルにカスタマイズすることができます。 TOC+ プラグインのデフォルト表示 ここでは、「Table of Contents Plus」の目次デザインのためだけに外部WebフォントやFont Awsomeのような重たいアイコンフォントデータを使用せずに、CSSのみで目次…