
WordPressのCocoonテーマで人気のSILKスキンを使用している方から、カスタマイズの質問が来ましたので解決する方法をご紹介します。
目次
問題の概要
SILKスキンでは、H2見出しを使用すると自動的に番号が付与されます。例えば:
- 見出し2XXXXX
- 見出し2XXXXX
- 見出し2XXXXX
というように番号が文字の前に自動的に追加されてしまいます。この機能は時として邪魔になることがあり、解除したいというご要望をいただきました。
原因
SILKスキンのCSSを調べたところ、以下のコードが自動番号付けの原因でした:
.entry-content h2 > span::before {
content: counter(h2, decimal) ". ";
counter-increment: h2;
}
このCSSコードは、H2見出しの前に自動的に連番を挿入する機能を実装しています。
解決方法
この自動番号付けを解除するには、以下のいずれかの方法を使用できます:
方法1:カスタムCSS追加
Cocoonテーマの管理画面から「カスタマイズ > 追加CSS」に以下のコードを追加します:
.entry-content h2 > span::before {
content: none !important;
counter-increment: none;
}
方法2:子テーマ作成
より恒久的な解決策として、子テーマを作成し、style.cssに上記のコードを追加する方法もあります。
注意点
- この設定を行うと、すべてのH2見出しから番号が消えます
- 個別に番号を付けたい場合は、HTMLで直接番号を記述する必要があります
- Cocoonテーマのアップデートがあっても、この設定は維持されます
まとめ
SILKスキンのH2見出し自動番号付けは、シンプルなCSSコードで解除できます。ブログの見た目をよりカスタマイズしたい方は、ぜひお試しください。
なお、この設定変更はいつでも元に戻すことができますので、安心して試してみてください。
ブログのカスタマイズや作成運用にお困りの方はご相談していただければお力になれることもあるかもしれませんのでどうぞ。