WordPressでつくったホームケージやブログ、他の人のサイトやブログをみていると、
おしゃれなデザインのものが多いですよね。
WordPressでの「フォント」は、デフォルト状態だと選んだテーマによって異なります。
全体のデザインもそうですが、フォント(書体)を変えるだけでも
サイト全体のイメージを変えてくれます。
例えば「親しみやすく」や「洗練された」感じになどなど。
ただ、フォント(書体)をかえるとなると、なんとなく難しそうなイメージです。
「コードをコピーして、、CSSを調整して…という手順はには無理!」
という拒否反応が私にはありました。
そんな私のような超初心者の方にオススメなのが、
コード変更一切不要でフォントを変更ができるWordPressのプラグイン「Easy Google Fonts」です。
今日はそんな「Easy Google Fonts」の設定方法のご紹介です。
超初心者の私でもできたのでぜひぜひためしてみてください。
Easy Google Fontsとは
Easy Google Fontsは、その名の通りGoogleが提供しているWebフォントGoogle Fontsを、
コード変更一切不要でフォントをつかえるプラグインです。
Google Fontsは世界各国のさまざまな言語に対応しており、1,000種類ものフォントが無料で提供されています 。
上記のEasy Google Fonts プラグイン公式ぺージサイトからダウンロードできます。
Google Fonts の見本

日本語対応は31書体
※2021年9月現在

Easy Google Fonts の使い方
以下のようなたった「4ステップ」です。
- プラグインをインストール
- プラグインを有効化(これでEasy Google Fontsが使用できるようになりました。)
- WordPressのカスタマイザーを開く
- フォントを設定
1.プラグインをインストール
まずはプラグインをインストールします。管理画面から プラグインへ。
プラグインを追加のところから先ほどダウンロードした「Easy Google Fonts 」をアップロードします。

2.プラグインを有効化
プラグインをアップロードすると一覧に「Easy Google Fonts 」が表記されるのでこちらを有効化します。

これでEasy Google Fontsが使用できるようになりました!(あともうちょっと!です)
3.WordPressのカスタマイザーを開きます
ワードプレスの管理画面から「外観」>「カスタマイズ」を選択します。

カスタマイズの画面へ移行し「Typography」の項目が確認できます。
「Typography」を選択し、「Default Typography」をクリックしてフォントの編集画面に移行します。

すると、以下のようなメニューが表示されます。
このメニューをからフォントを設定していきます。

4.フォントを変更
以下の要素のフォントが設定できるようになっています。
- Paragraphs(Pタグ/本文のこと)
- H1〜H6
今回はわかりやすいように、Paragraphs(Pタグ/本文のこと)のフォントを変更してみます。
まず、Paragraphsをクリックし、次にFont Familyをクリックします。

検索ボックスが表示されるので、設定したいフォント名を入力してください。
今回は、Google Fontsの日本語フォントの中から「Noto Sans JP」を設定してみます。

見比べてみると違いがはっきり分かるかと思います。
変更が完了したら「公開」ボタンをクリックして変更内容を保存すれば反映が完了です。
(ここまでで終了ですが、もっとヨクが出てきた方に!)
5.フォントの細かい設定も可能

Styleタブをクリックすれば、フォントの太さ以外にもさまざまなカスタマイズが可能です。
⚫️Font Color 文字色の変更できます。
⚫️Background Color 文字の背景色が変更できます。
⚫️Font Size 文字サイズが変更できます。
⚫️Line Height 行間が変更できます。
⚫️Letter Spacing 文字同士の間隔が変更できます。

文字を小さくしたり

文字間を変更してみたり
超初心者の私でもとても簡単でした。
書体や色を変えるだけで全体のイメージが変わりますよね!
ぜひ自分好みの変更を気軽に試してみてください。
コメント