サイドバーのみフォントの大きさを小さくしたい

わいひら様

ご丁寧な回答をありがとうございます。
デベロッパーツールの詳しい説明もありがとうございます。勉強させていただきます。

教えていただいたコードをスタイルシートに挿入してもサイドバーのフォントの大きさは変わりません。

サイドバーのテキストはウィジェット内の自由テキストで挿入しているためかな？と思っているのですが、ウィジェットの自由テキストとサイドバーのフォントは違うものなのですかね？

重ね重ね大変申し訳ありません。

おそらくこう言われるでしょう、自由テキストってなんでしょか？と（笑）

まずデベロッパーツール(F12キー)で、直接各セレクタのプロパティをいじった場合どうなるかを確認する必要がありそうです。

例えばChromeのツールでは、左側html欄とパネル右側のプロパティ欄で確認できるのですが、左側html欄で#containerを開いていき、#body-inの中に#sidebarはあるかと思います。面倒な場合はCtrl+Fで検索も良いです。

左側の#sidebarをセレクトすると、右側のプロパティ欄に適応されている値がそれぞれ出てきます。今チラリと見てみると、#sidebarには、

#sidebar {
    float: right;
    margin-bottom: 30px;
    width: 300px;
}

こういう記述がありました。ここなどに直接font-size:19pxと入れると、リアルタイムでブラウザ内のサイト表示が変化するのがわかると思います。更に、その値の右側に、style.css(行数)とが書いてあると思うんですが、そこにマウスオーバーすると、どのファイルから読み込まれているのかがわかります。
例えば、このstyle.cssがインラインとか、indexと表示してある場合は、htmlに出力されてます。つまりは、headタグのstyleタグ内に書かれているわけです(あるいはタグにstyle=”font-size:xx”など)。

この場合は、スタイルシートよりも優先されてしまうと思われますので、それを直す方法を考えねばなりません。例えばカスタマイザーではフォントサイズを15pxや16pxに設定して、大きな文字にしたい#sidebar以外のセレクタのフォントサイズを変更するなどです。

最悪、タグの中にstyle=”font-size:xx”とある場合は、jQueryなどで修正します(その箇所のタグを出力しているPHPを書き変えたりも)。

jQueryの場合、子テーマjavascript.jsに

(function($){
  $(function(){
    $("目的のセレクタ").attr("style", "書き変えたいスタイル");
  });
})(jQuery);

などで書き換えることも可能です。jQueryやjavascriptはcssより普通は後で読み込まれるので確実に変更できます。指定して書き直す場合は、$.css()を利用します。こちらのがわかりやすいかも。

$("目的のセレクタ").css({
  font-size: 19 + "px",
  color: "#333"
});

など。

Hidekichi様

大変分かりやすい回答ありがとうございました。
1つ1つ確かめながらやってみます。

回答をいただいたわいひら様にもお礼を申し上げます。
ご迷惑をおかけしてすいませんでした。