見出しをカスタマイズしたのに、カスタマイズした通りに表示されないことがあると思います。
例えば、バズ部の有名なテーマXeory Baseの場合。
下記記事で紹介している見出しの装飾でH2がその通りに反映されません。
やりたいのは上下にシンプルな線の見出しの装飾です。
h2 {
padding: .75em 0;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
でもこれがこうなってしまいます。
上が詰まってしまっていますよね。
解決法はこちら。
ダッシュボード>外観>カスタマイズ>追加CSSに下記を入力
.post-content h2 {
padding: .75em 0;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
1行目がちょっと違いますね。
上記の入力をするとこうなります。
以上です!
ここからは私の経験。
今回、この見出しはXeory Baseを使っている方からお問い合わせを受けた内容なのですが、こういうことは見出しだけでなく囲み枠や余白の設定でも起きるんですよね。
いろいろなテーマを触っていると、何であのサイトではできたのにこのサイトではできないの?ということが起きます。
テーマAでは見出し2のことを「h2」と呼び、テーマBでは見出し2のことを「.post-content h2」と呼ぶ、ということみたいです。
絆創膏(ばんそうこう)のことを「バンドエイド」と言うか「カットバン」と言うか。地域によっては通じないですよね。(商品名ですが)
子どもの頃、私は「カットバン」と言っていたのですが、別の県に引っ越したときに「カットバン」と言ったら「???」という顔をされたことがあります(笑)
WordPressのテーマにはそのテーマの言葉があると解釈していただければいいのかなと思います。
原因の詳細を知りたい方はこちらの記事が詳しいです。
見出しのデザインをカスタマイズしても反映されない原因と対策
https://www.nishi2002.com/24295.html