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をコピーしました!
目次