【WordPress】ブログのフォント変更は「Easy Google Fonts」で簡単解決

こんにちは。ヒロユキです。

小松田さん

サイトのイメージに合わないから
フォントを変えたいなぁ…。

けどHTMLもCSSもわかんないし
変にいじって戻らなくなるのが怖い…。

外注しなくちゃダメかな…。

↑こんな悩みを抱えてませんか?

WordPressで作ったサイトならプラグインを使って、簡単にフォントの変更ができますよ。

今回は「Easy Google Fonts」を使った、フォントの変更についてお話します。

WordPressブログのフォント変更は「Easy Google Fonts」で簡単解決

フォントを変えるメリット

フォント変更のメリット
  • サイトのイメージやコンセプトにあった字体を選べる
  • アルファベットや漢字が読みやすくなる場合がある
  • サイト作成のモチベーションUP

サイトのイメージやコンセプトにあった字体を選べる

デフォルトのフォントは読みやすくて「悪い」わけではありません。

でも、少し物足りないと感じる方もいるんじゃないでしょうか?

それは、どのサイトやブログにも、作り手の「イメージ」や「コンセプト」があるから。

そういった「全体の雰囲気」にフォントも合わせたほうが、サイトに一体感が出やすくなります。

アルファベットや漢字が読みやすくなる場合がある

フォントの変更時に影響を受けやすいのは「アルファベット」と「漢字」です。

もともと「フォントの種類」は英語が中心です。

日本語」に対応しているフォントでも「アルファベット」は特に、個性的な字体になることが多い印象です。

また、「漢字」も画数が多い分フォントによって色んな「あじ」が出やすくなってます。

サイト作成のモチベーションUP

フォントが変わって、何に影響が出るかというと「自身のモチベーション」ですね。

もちろん、訪問者さんの「見やすさ」「読みやすさ」が大前提ですが、コツコツ積み上げていく「あなた」のモチベーションも大切です

自分を表現する「ひとつの手法」として、「フォントの変更」はおすすめです。

ヒロユキ

ボクの生まれた高知県では「りぐる」という方言があります。
「凝る」とか「クオリティを上げる」といった意味で使われます。

フォントを変えることで、自分好みに「りぐって」いきましょう。

フォント選びの注意点

フォント選びの注意点
  • フォントは約1,000種類あるので、日本語フォントを下調べしておかないときりがない
  • フォントによっては「記号」が、うまく表示されない場合がある
  • フォントによって「字間」が異なるので、デザインのバランスが崩れる恐れがある

フォントは約1,000種類あるので
日本語フォントを下調べしておかないときりがない

フォントの種類」は英語に対応しているものが中心で、「日本語」にフォントが反映されるものは、そのなかの一部です。

気になったものを順番に試してみるのもいいですが、なかなかの重労働。

日本語フォント」をプレビュー紹介しているサイトもあるので、下調べをして、ある程度の目星をつけておくのが、おすすめです。

【2020年版】Google Fontsの使い方とおすすめ日本語フォント

フォントによっては
「記号」がうまく表示されない場合がある

フォントによっては、「記号」が非表示になったり、個性的に変化しすぎて、もはや元の形がわからない…なんてことがあります。

WordPressなどでサイトを作る際に、編集画面ではフォントが反映されません

編集画面で問題なくても、公開したサイトを見てみると「あれ?記号が消えてる!」ってことがあります。

公開前には、必ずプレビュー機能を使って「内容の確認」をしましょう。

フォントによって
「字間」が異なるのでデザインのバランスが崩れる恐れがある

フォントは「文字」だけでなく「字間」にも影響します。

同じ文章でも「フォント」を変えると、きゅっと縮まったり、間延びすることがあります。

文字を使ったデザインによっては、全体のバランスが崩れることがあるので、注意が必要です。

フォント変更の手順

フォント変更の手順
  1. 「Easy Google Fonts」のダウンロード
  2. 「Easy Google Fonts」の有効化
  3. カスタマイズ画面を開き「Typography」からフォント変更

「Easy Google Fonts」のダウンロード

「Easy Google Fonts」のDL方法
  • ①-1 WordPressのダッシュボードを開く
  • ①-2 画面左のダッシュボードメニューから「プラグイン」→「新規追加」をクリック
  • ①-3「プラグインを追加」画面右上の検索窓で「Easy Google Fonts」を検索
  • ①-4 検索結果に表示された「Easy Google Fonts」の「今すぐインストール」をクリック
  • ①-5 同じく「Easy Google Fonts」右上に表示される「有効化」をクリック

「Easy Google Fonts」の有効化

Easy Google Fonts」を有効化する方法
  • ②-1 WordPressのダッシュボードを開く
  • ②-2 画面左のメニュー欄から「プラグイン」→「インストール済みプラグイン」を選択
  • ②-3 一覧から「Easy Google Fontsを探し「有効化」をクリック

カスタマイズ画面を開き「Typography」からフォント変更

Typography」からフォント変更
  • ③-1 WordPressのダッシュボードを開く
  • ③-2 画面左のメニュー欄から「外観」→「カスタマイズ」を選択
  • ③-3「Typography」をクリック

参考画像は、WordPressテーマ「STORK19」を使用しています。

  • ③-4 フォント変更したい項目を選ぶ
  • ③-5 「Font Family」から好きなフォントを選ぶ

h1〜6ってなに?って人はコチラの記事もどうぞ↓

ヒロユキ

フォントを選ぶと、画面右側のプレビューに反映されます。確認しながら選ぶとイメージしやすいよ。

おすすめのフォント

おすすめのフォント
  • Kosugi Maru
  • M PLUS 1p
  • Arbutus Slab
ヒロユキ

Kosugi Maru」は柔らかい感じのフォントで、特に気に入ってます。

現在「つみきのーと」のフォントは「Arbutus Slab」を使用中。

アルファベットの雰囲気がお気に入り。

ブログのフォント変更は「Easy Google Fonts」で簡単解決のまとめ

今回のまとめです。↓

フォント変更のメリット
  • サイトのイメージやコンセプトにあった字体を選べる
  • アルファベットや漢字が読みやすくなる場合がある
  • サイト作成のモチベーションUP
フォント選びの注意点
  • フォントは約1,000種類あるので、日本語フォントを下調べしておかないときりがない
  • フォントによっては「記号」が、うまく表示されない場合がある
  • フォントによって「字間」が異なるので、デザインのバランスが崩れる恐れがある
フォント変更の手順
  1. 「Easy Google Fonts」のダウンロード
  2. 「Easy Google Fonts」の有効化
  3. カスタマイズ画面を開き「Typography」からフォント変更
「Easy Google Fonts」のDL方法
  • ①-1 WordPressのダッシュボードを開く
  • ①-2 画面左のダッシュボードメニューから「プラグイン」→「新規追加」をクリック
  • ①-3「プラグインを追加」画面右上の検索窓で「Easy Google Fonts」を検索
  • ①-4 検索結果に表示された「Easy Google Fonts」の「今すぐインストール」をクリック
  • ①-5 同じく「Easy Google Fonts」右上に表示される「有効化」をクリック
Easy Google Fonts」を有効化する方法
  • ②-1 WordPressのダッシュボードを開く
  • ②-2 画面左のメニュー欄から「プラグイン」→「インストール済みプラグイン」を選択
  • ②-3 一覧から「Easy Google Fontsを探し「有効化」をクリック
Typography」からフォント変更
  • ③-1 WordPressのダッシュボードを開く
  • ③-2 画面左のメニュー欄から「外観」→「カスタマイズ」を選択
  • ③-3「Typography」をクリック

参考画像は、WordPressテーマ「STORK19」を使用しています。

  • ③-4 フォント変更したい項目を選ぶ
  • ③-5 「Font Family」から好きなフォントを選ぶ

h1〜6ってなに?って人はコチラの記事もどうぞ↓

ヒロユキ

フォントを選ぶと、画面右側のプレビューに反映されます。確認しながら選ぶとイメージしやすいよ。

おすすめのフォント
  • Kosugi Maru
  • M PLUS 1p
  • Arbutus Slab

「りぐり」だすと気づけば何時間も経ってしまうほど「フォント選び」は楽しいもの。

自分を表現する「ひとつの手法」として、「フォントの変更」をお試しあれ。

それではまた。ヒロユキでした。

気に入ったらシェアしてね

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です