「Google Fonts」の日本語フォントをWordPressで使う方法とは？
2020/03/29
「Google Fonts」はオープンソースのWEBフォントで、様々なデザインのフォントを無料で利用できるサービスです。英数フォントがほとんどですが、数は少ないながらも日本語フォントも用意されています。Wordpressで「Google Fonts」の日本語フォントを使用したいときはどのような方法で行えばよいのでしょうか。
WEBフォントを使うメリット
ホームページのタイトルや見出しなどを本文とは異なるフォントで表示したいというときはCSSなどを利用して表示フォントを指定する方法が一般的です。しかし、ホームページを閲覧したときに表示されるフォントは通常、閲覧に使用しているクライアントに依存しているため、クライアントに入っていないフォントを指定していると思った通りのフォントを表示できません。
Webフォントはサーバーに置いてあるフォントを読み込んで表示する仕組みのため、クライアントやデバイスに関わらず意図したとおりのフォントを表示することができます。
Google Fontsで使いたいフォントを探す
まずはGoogle Fontsのページで使用したいフォントを探します。日本語フォントだけを見たいという場合はサイドバーにあるLanguagesをクリックしてJapaneseを選ぶと日本語フォントだけが表示されます。
使用したいフォントが見つかったらフォントの詳細情報を確認してください。Google Fontsを利用するために必要なLink記述とフォントの指定方法が表示されます。
「header.php」と「style.css」をカスタマイズする
WordPressでテーマを使用している場合は「header.php」と「style.css」をカスタマイズすることでフォントを指定することが可能です。WordPress管理画面の「テーマ」から編集するか、ローカル環境で編集してからFTPアップロードを行いましょう。
「header.php」には、<head></head>タグ内に、Google Fontsページのフォントの詳細情報に書かれていた<link href…以下を貼りつけます。「style.css」はファイル内から「font-family」の記述がある部分を探し、Google Fontsページのフォントの詳細情報に書かれているタグに置き換えれば完了です。
プラグインを利用する
「header.php」と「style.css」をカスタマイズしてもよいですが、直接編集するのが不安・不便だと感じる場合はプラグインを利用してもよいでしょう。Wordpressには日本語フォントを追加するためのプラグインが存在します。使用方法や機能はプラグインによって異なりますが、複数のフォントを使用したい、WordPressのブロック毎にフォントを指定したいといったときはプラグインを利用すると便利です。
まとめ
WordPressで「Google Fonts」の日本語フォントを使うには、スタイルシートなどを編集する方法とプラグインを利用する方法の2通りがあります。用途やカスタマイズ性などを考慮し、自分に合った方法を選んでください。
