WordPress2017年デフォルトテーマTwenty Seventeenのフォント指定を変更しました。先に書いておきますが、TwentySeventeenは最初からStyle.cssに日本語のフォントファミリーの指定がされています。特にこだわりが無ければそのままで良いと思いますが、AppleのRetinaディスプレイ用にApple製端末だけは明朝体を指定したいという、前テーマからの個人的なこだわりで変更しました。
このページの目次
WEBフォントは置いておいて
TwentySeventeen親テーマのfunctions.phpに、GoogleのWEBフォントを使う記述があります。Google WEBフォントからLibre Franklin 書体を読み込むようになっているようです。ただし、日本語フォントではないので日本語環境では使われることはないでしょうか。functions.phpにLibre Franklinがサポートしていない言語の場合は「off」に書き換えろと書いてあります
私は、WEBフォントとは何ぞやというレベルの人なので、正直に言うと、まったく難しくてわからない状態なのです。functions.phpはなるべくいじりたくない派なので、そのままにしています。twentyfifteenのときも同じように放置したままで問題なかったので、やはり今回も放置です。
style.cssに日本語フォント指定あり
TwentySeventeen親テーマのstyle.cssを見てみますと、一番上にはhtml { font-family: sans-serif; } しか指定されておらず、そのずっと下の5.0 Typographyの項目で、アルファベット以外の文字の言語別にフォントファミリーの指定がなされています。日本語の指定は824行目から始まっています。
/* Typography for Japanese Font */
html[lang="ja"] body,
html[lang="ja"] button,
html[lang="ja"] input,
html[lang="ja"] select,
html[lang="ja"] textarea {
font-family: "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;
}デフォルトで、MacとiOSではヒラギノ角ゴシック、Windowsではメイリオ、その他はゴシック系のフォントファミリー指定がされています。2017年ですから、もうXP以前のWindowsでMSゴシックが表示されようが気にする必要もないと思うので、こだわりがなければこのまま何もしなくても大丈夫でしょう。
個人的好みのフォントファミリーに変更しました
私は、AppleのRetinaディスプレイには明朝体が見栄えがするというこだわりがあります。Macは持っていないのですが、Appleストアや量販店などでRetina Macで自分のサイトを見るたび、やっぱり明朝体だなと感じています。
また、windows8.1と10用に游ゴシックを指定しています。游ゴシックが気に入っているわけではありませんが、どちらかというとメイリオがあまり好きではないのです。游明朝にしようかなとも考えましたが、windows10の游明朝は高解像度ディスプレイじゃないとキレイではないと感じるPCが多いので、消去法で游ゴシックにしています。
ということで、このフォントファミリーにしました。
font-family: YuMincho, “Hiragino Mincho ProN”, “游ゴシック”, “メイリオ”, sans-serif ;
- YuMincho ・・・MacOS用
- Hiragino Mincho ProN ・・・iOS、旧MacOS用
- 游ゴシック ・・・windows8.1/10用
- メイリオ ・・・windowsVista/7用
- sans-serif ・・・その他用
子テーマのstyle.cssに追記した内容です。
/* Typography for Japanese Font */
html[lang="ja"] body,
html[lang="ja"] button,
html[lang="ja"] input,
html[lang="ja"] select,
html[lang="ja"] textarea {
font-family: YuMincho, "Hiragino Mincho ProN", "游ゴシック", "メイリオ", sans-serif ;
}