「Easy Table of Contentsの設定方法を解説!」の続きです。
こんな感じ↓で…
小見出しに付いてしまう丸を消すCSSを紹介します。
この小見出しに意図しない点がついてしまうのは、Easy Table of Contentsで目次を設定して
かつ
「見出し:」という項目で…
「見出し2」より下の部分にもチェックを入れていると起こります。
もちろんエラーが出るような重篤な不具合ではないのですが、見た目的に普通に気になりますよ(^_^;)
そこでこちらの記事では、このように↓小見出しに丸の付いてない状態にする方法を紹介いたします!
目次
スポンサーリンク
JINでEasy Table of Contentsを使っても目次の小見出しに丸が付かないようにする方法を動画で解説!
Easy Table of Contentsを使っても目次の小見出しに丸が付かないようにする方法!
お使いのテーマの『子テーマ』が有効化してある状態で作業を行なってくださいね。
コードをコピー
下記のコードを(次にペーストするために)コピー
.cps-post-main ul:not([class]) li:before, .cps-post-main table ul:not([class]) li:before{ display: block; content: ”; position: absolute; top: 0.6em; left: 10px; width: 6; height: 6; background-color: #2b2b2b; border-radius: 100%; } .ez-toc-list li > ul li:before { content: none !important; } |
続いて、コピーしたコードをWordPressにペーストします。
WordPressにペースト
WordPressダッシュボードの…
「外観」をポイント →「カスタマイズ」をクリック
↓
「追加CSS」をクリック
↓
先ほどコピーしたコードを…
こんな感じ↑にペースト
この時、すでに何かコードが入っている場合は、一番上か一番下にペーストすればOKです。
↓
「公開」をクリック
プレビューなどで確認してみると、目次の小見出しの●が消えているはずです。
消えない場合はキャッシュが残っていることが考えられますので、キャッシュをクリアしてから、もう1度確認してみてください。
さいごに
JINでEasy Table of Contentsを使って目次を表示させる際、小見出しに付く丸を消す手順は、JINの子テーマが有効化してある状態で
- コードをコピー
- WordPressの「追加CSS」にコードをペースト
- (変更が反映されない場合は)キャッシュクリア
でしたね。
参考になれば幸いです。