ワードプレスでCocoonを使っていると、サイドバーとエントリーカードの文字が大きくて気になりますよね。
文字を小さくしたいけど、どうすればいいの?
追加CCSに、文字の大きさを変えるCCSコードを入力するだけで変更できますよ。
今回は、文字を小さくしたい人向けに、サイドバーとエントリーカードの文字の大きさを小さくする方法を紹介します。
ワードプレスカスタマイズ サイドバーとエントリーカードの文字の大きさを小さくする方法【Cocoon】
- CocoonのCCSカスタマイズのページを開く
- サイドバーの文字の大きさを変えるCCSコードを入力する
- 新着投稿の記事の文字の大きさを変更するCCSコードを入力する
- エントリーカードの文字の大きさを変更するCCSコードを入力する
順番に説明しますね。
CocoonのCCSカスタマイズのページを開く
まず最初に、ワードプレスにログインして、ダッシュボードを開きます。
左側のメニュー一覧から「外観」→「カスタマイズ」をクリックします。
すると以下の画面が表示されるので、一番下にある、「追加CCS」をクリックします。
ここに文字の大きさを変更する、CCSコードを入力していきます。
サイドバーの文字の大きさを変えるCCSコードを入力する
サイドバーの文字の大きさを変更するには、以下のコードを追加CCSに入力します。
#sidebar {
font-size: 14px;
}
文字の大きさは、任意で変更できます。
font-sizeの後ろにある、14の数値を変えると、文字の大きさを変えられます。
文字を小さくするには、数値を小さく、文字を大きくするには、数値を大きくしましょう。
上記のコードで、自己紹介やカテゴリーなどの文字の大きさは変更できました。
だけど何度試してみても、新規投稿の記事だけは、文字が大きいままで変更できません。
それで以下のコードを、追加で入力すると文字の大きさが変更できました。
新着投稿の記事の文字の大きさを変更するCCSコードを入力する
新着記事の文字の大きさを変更するには、以下のコードを追加CCSに入力します
.widget-entry-card-content{
font-size: 8pt;
}
font-sizeの後ろにある、8の数値を変更すると、文字の大きさを変えられます。
何度試しても新着記事の文字の大きさが変わらない人へ、上記のコードを入力してみてください。
エントリーカードの文字の大きさを変更するCCSコードを入力する
エントリーカードの文字の大きさを変えたい場合は、以下のコードを入力します。
.entry-card-title {
font-size:20px;
}
font-sizeの後ろにある、20の数値を変更すると、文字の大きさを変えられます。
まとめ
今回は、ワードプレスでCocoonを利用している人向けに、サイドバーとエントリーカードの文字の大きさを小さくする方法を紹介しました。
文字の大きさは、CCSコードを入力するだけでかんたんに変更できるので、試してみてくださいね。