今回はの記事では、WordPressテーマ：賢威7の「PVランキング・ウィジェット」に表示される、ウィジェットタイトルの文字サイズを変更する方法を紹介したいと思います。

文字だけでは分かりにくいと思うので、まずはカスタマイズ前後の画像をご覧ください。

カスタマイズ前

↓　「PV数ランキング」と表示されているウィジェットタイトルの文字サイズを変更していきます。
（最初は18px）

カスタマイズ後

↓　「PV数ランキング」という部分の文字サイズを12pxに変更

↓　「PV数ランキング」という部分の文字サイズを24pxに変更

はじめに

まずは管理画面のウィジェットページから「PV数ランキングウィジェット」の設定をしていきます。

ここでは 「画像＋ランキング番号のリスト」に設定しましたが、「王冠アイコンのリスト」など別の設定でも同じようにカスタマイズすることができます。

↓ 「画像＋ランキング番号のリスト」 の設定

また、今回は子テーマを使ってカスタマイズしていきます。子テーマの作り方については下のページに書いておきました。

賢威7.0で子テーマを使用する方法とその不具合の直し方

CSSファイルを編集

見た目を変更したいので、ここではCSSファイルを編集していきます。

タイトルの文字サイズを12pxにする

まずはウィジェットタイトルの文字サイズを12pxにする方法です。

以下のコードを子テーマの style.css に追加します。親テーマをお使いの場合には、base.css などのCSSファイルに追加して下さい。

.sub-conts .section-wrap.widget_keni_pv .section-title {
    font-size: 12px;
}

保存・更新すると、ウィジェットタイトルの文字サイズが18pxから12pxになりました。

タイトルの文字サイズを24pxにする

今度はウィジェットタイトルの文字サイズを24pxにしてみます。

先ほどと同じように、お使いのCSSファイルに以下のコードを追加します。

.sub-conts .section-wrap.widget_keni_pv .section-title {
    font-size: 24px;
}

保存・更新すると、文字サイズが18pxから24pxになりました。

お好みの文字サイズにするには？

ウィジェットタイトルをお好みの文字サイズにする方法も、ここまでに紹介したものとほとんど一緒です。

追加するコードは下のような形式になるので、お好みの文字サイズを○○px部分に入れてもらえば大丈夫です。

.sub-conts .section-wrap.widget_keni_pv .section-title {
    font-size: ○○px;
}

例えば24px にする場合は、先ほどのコードの font-size: の後を 24px; にします。
他の文字フォントサイズについても同じ要領で変更することができます。

.sub-conts .section-wrap.widget_keni_pv .section-title {
    font-size: 24px;
}