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