こんにちは！nicoです。
ワードプレスの神テーマである「SWELL」でも一部カスタマイズができない部分があるかと思います。
今回は投稿ページのタイトルの色を変える方法をご紹介します！
デフォルトだとタイトルと本文は同じ色になりますが、上図のようにタイトルの色だけ変えることができます！
CSSですが、コピペでできるので初心者の方でも簡単に変更できます☺
引っ越しによりストレスで病気になる
在宅で仕事をしたいため、アラフォー未経験からフリーランスのウェブデザイナーへ
タイトルのフォントカラーを変える方法
デフォルトだとタイトルのテキストカラーは「基本カラー」で決めたテキストカラーになっているかと思います。
私の場合、初期の#333333に設定されています。
カスタマイズの「テキストカラー」を好きな色に変えてみましたが、それだと本文の色も同じ色になってしまいますよね。
これだと非常に見えにくいです。
そこで、本文のテキストカラーはそのままでタイトルのテキストカラーだけを変えるCSSを使います。
.c-postTitle__ttl{
color:#D16E84;
}
#の部分は好きなカラーコードを入れてください。
これでタイトルは任意のカラー、本文は「基本カラー」のテキストカラーになりました！
ちなみに、「カスタマイズ」の「追加CSS」にCSSをペーストした場合はすべてのページに反映されますが、任意のページにだけ対応させたい場合は各ページの下のほうにある「カスタムCSS ＆ JS」の「CSS用コード」にCSSを入れます。
上の画像の赤枠部分にさきほどコピーしたCSSを入れることで、そのページにだけCSSが反映されます。
リスト表示しているタイトルの色を変える
タイトルの色は変更できましたが、これだけではリストとして表示しているときのタイトルは基本カラーのままです。
リスト表示で見たときはタイトルの色が変わっていないね・・・
こんなふうにタイトルの色だけ変えます！
.p-postList .p-postList__title{
color:#D16E84;
}
#の部分は好きなカラーコードを入れてください。
これでタイトルの色だけが変わりました！
とっても簡単にできましたよね。
ぜひ活用してみてくださいね！
コメント