WordPressテーマSANGOの質問

デフォルトの見出しをオリジナル見出しで装飾したい

tomboy

2018/11/08

お世話になっております。SANGOテーマのカジュアル具合に惚れ、購入させていただきました。
初歩的な質問となり申し訳ないのですが、「.entry-content h」タグを、全て子テーマのcssで装飾しようと思っております。例えば、こちらのページに記述されている、hh14を使用しようとするのであれば、子テーマのstyle.cssにはどのように記述すればよいのでしょうか。

見出しの挿入方法と種類一覧

コメントへの回答

サルワカくん

2018/11/08

お世話になっております。
なるほど。hh14などの見出しのCSSは「entry-option.css」に記載されています。
例えば、hh14見出し用のスタイルは

#inner-content .hh14 {
 position: relative;
 margin-right: 5px;
 margin-left: 5px;
 padding: .2em .5em;
 border: dashed 2px white;
 background: #c8e4ff;
 box-shadow: 0 0 0 5px #c8e4ff;
 color: #454545;
}
#inner-content .hh14:after {
 position: absolute;
 top: -7px;
 left: -7px;
 border-width: 0 0 15px 15px;
 border-style: solid;
 border-color: #fff #fff #a8d4ff;
 box-shadow: 1px 1px 1px rgba(0, 0, 0, .15);
 content: "";
}

です。
この部分をコピペして子テーマのstyle.cssに貼り付けたうえで、
#inner-contentを.entry-contentに書き換え
.hh14をh2に書き換えれば、h2見出しに対してhh14と同じスタイルが適用されます。

例

.entry-content h2 {
 position: relative;
 margin-right: 5px;
 margin-left: 5px;
 padding: .2em .5em;
 border: dashed 2px white;
 background: #c8e4ff;
 box-shadow: 0 0 0 5px #c8e4ff;
 color: #454545;
}
.entry-content h2:after {
 position: absolute;
 top: -7px;
 left: -7px;
 border-width: 0 0 15px 15px;
 border-style: solid;
 border-color: #fff #fff #a8d4ff;
 box-shadow: 1px 1px 1px rgba(0, 0, 0, .15);
 content: "";
}