ワードプレスでサイトタイトルの文字サイズをCSSで変更する方法

あなたはワードプレスでご自分のサイトを作成している時に、サイトタイトルの文字サイズをCSSで変更したいと思った事はありますか？

じつはCocoonなどの一部のテーマでは、サイトタイトルのサイズを設定などで変更する事はできません。

CSSというコードでワードプレスのデータに追記しなくてはならないのです。

ここでは、初心者の方にもわかりやすく変更方法をお伝えします。

テーマによって仕様が違いますが、ここでは「Cocoon」と「Lightning」のテーマで行う方法です。

それではまいりましょう！

Cocoonで変更する方法

ここではCocoonの設定についてご説明します。

ではまず、変更する場所ですが、ワードプレスのダッシュボードから以下の所へ進んでください。

「外観」→「カスタマイズ」→「追加CSS」

この「追加CSS]へ以下を記述します。

サイトタイトルの文字サイズ変更

24のところの数字を変えると大きくなります。

以上です。

すごく簡単ですね(*^-^*)

サブタイトル文字サイズ変更

サブタイトルの大きさを変えたい場合は「追加CSS」に以下を記述します。

色を変えたい場合

色を変える場合は以下で設定です。

「ダッシュボード」から「Cocoon設定」で変更できます。

以下の順にクリックしてください。

「ヘッダー」→「ヘッダー色（ロゴ部）」→「ロゴ文字色」で色を選択します。

Lightningで変更する方法

つづいてLightningというテーマでも以下のところに記述します。

「外観」→「カスタマイズ」→「追加CSS」

サイトタイトルは以下を記述します。

サイトタイトルのサイズは以下を記述します。

Cocoonとは違うので注意してください。

スライドショーのタイトル文字サイス変更

Lightningの特徴でもあるスライドショーのタイトルサイズ変更はこちらです。

この場合は「横幅が1200以上の時に32pxサイズで適用されるという意味」となります。

スライドショーのサブタイトル文字サイズ変更

スライドショーのサブタイトルを変える場合はこちらです。

それぞれ「カスタマイズ」→「追加CSS」に記述してくださいね。

まとめ

テーマによっては設定で変更できる場合もあります。

もし変更できないテーマの場合は「追加CSS」にサイトで調べたコードを記述してください。

「テーマ名　タイトル　サイズ変更」などで検索すればCSSコードが出ると思います。

もし間違っていてもコードを消してしまえば元に戻りますので安心してやってみてください。

今回は「ワードプレスでサイトタイトルの文字サイズを変更する方法」をお伝えしました(*^-^*)