モッピー!お金がたまるポイントサイト

WordPress[Stinger3用 子テーマ]フォントを変更する方法

2021/06/21

WordPress[Stinger3用 子テーマ]フォントを変更する方法

前回は、WordPress[Stinger3用 子テーマ]サイトマップ(目次)を設置する方法の備忘録を投稿しました。しばらく「子テーマシリーズ」で投稿を地道に増やして行こうと思います(笑)今回は「Stinger3子テーマ使用時のフォントの変更の仕方」です。以前、親テーマのみの場合のフォントの変更方法、

[adsense]

を投稿させて頂いていますが、子テーマを使用した場合の変更方法が分からない方もいらっしゃると思い記事にしました。今回も、OSXローカル環境にwordpressをインストールする方法で構築したローカル環境のWordPressで作業したいと思います。子テーマはroom9さんの「CANDY CRAZY」

を使用させて頂いています。カスタマイズ性が高くてオススメです。子テーマをまだ導入していない方は、こちらからチャレンジしてみてください!

[adsense]

Stinger3の子テーマ「CANDY CRAZY」のフォントは見やすい

「CANDY CRAZY」の元々のフォントは非常に見やすくお気に入りです。現状このようなフォントになっています。

WordPress[Stinger3用 子テーマ]フォントを変更する方法

変更するフォントですが、以前の投稿で設定したフォント(dmgadgetディーエムガジェットで使用しているフォント)を設定したいと思います。完成するとこのような見栄えになります。

WordPress[Stinger3用 子テーマ]フォントを変更する方法

それでは始めましょう!

[adsense]

子テーマのstyle.cssを開く

管理画面 → 外観 → テーマ編集 → stinger3 child theme -room9 custum 003 “CANDY CRAZY”-: スタイルシート (style.css)か、
何かしらのFTPアプリで子テーマのstyle.cssを開いてください。自分はTransmit4を使用しています。多くのブロガーさん達が使っています。オススメ!

WordPress[Stinger3用 子テーマ]フォントを変更する方法

開いた子テーマのsytle.cssの14行目からはこのような表記になっています。

/*-----------------------------
基本設定のカスタマイズ
------------------------------*/
* {
  font-family: Tahoma,hiragino maru gothic pron,meirio,arial,helvetica,osaka,"MS PGothic",sans-serif;
  margin: 0;
  padding: 0;
}

5行目の「font-family:」の行を変更します。下記のコードをコピーして、

  font-family: メイリオ, Meiryo, Osaka, “ヒラギノ角ゴ Pro W3″, “Hiragino Kaku Gothic Pro”, “MS Pゴシック”, “MS PGothic”, sans-serif;

5行目に貼付けてください。最終的に下記のようになれば完成です。

/*-----------------------------
基本設定のカスタマイズ
------------------------------*/
* {
  font-family: メイリオ, Meiryo, Osaka, “ヒラギノ角ゴ Pro W3″, “Hiragino Kaku Gothic Pro”, “MS Pゴシック”, “MS PGothic”, sans-serif;
  margin: 0;
  padding: 0;
}

ブログを確認しましょう。どうでしょうか? 正しく変更出来ましたでしょうか?読んで頂いてありがとうございました!

この記事を書いた人

ディーエムガジェット 

非IT系エンジニア。日々の出来事や自分の好きな物などの紹介をメインに色々発信していきます。2012 年から禁煙を開始して68キロぐらいだった体重が2012年6月には75キロまで増加。ヤバい!と感じてダイエットを開始。一回65キロまで落としましたが、2018年8月現在また72キロまで増加。こんな身体でもトライアスロンに出場予定「プロフィールはこちら

このエントリーをはてなブックマークに追加

WORDPRESS

Posted by dmgadget