WordPress theme Cocoonのタイトル文字サイズの変更方法

※本サイトはアフィリエイト広告を使用しています。

wordpress/ワードプレス

どうもこんにちは。
飛鳥です。

今回はWordPressの無料テーマで有名なCocoon(コクーン)のカスタマイズについてです。

サイトタイトルの文字の大きさを変更したい場合のカスタマイズ方法についてカキます。

方法は、
外観>テーマファイルエディタ>Cocoon Child の スタイルシート (style.css)を編集します。

  • 子テーマではなくてもCSSを編集すると反映されますが、テーマのバージョンアップなどでリセットされてしまうので、カスタマイズをするときは子テーマで編集しましょう。

font-size:XXpxという数字を変更することでPC,タブレット、スマホ各々のタイトルのフォントサイズが変更されます。


 
/* サイトタイトルの文字変更 */
.site-name-text {
	font-size: 2em;
	font-weight:bold;
}
/* タブレット用サイズ */
@media screen and (max-width: 768px) {
	#header .site-name-text {
		font-size: 18px;
	}
}
/* モバイル用サイズ */
@media screen and (max-width: 480px) {
	#header .site-name-text {
		font-size: 18px;
	}
}
タイトルとURLをコピーしました