ワードプレスにgoogle web fontsを設定してみる

2022.1.8 更新

ワードプレスには迷ってしまうほどの沢山のテーマがありますが、被りがちな公式のテーマを使っていても、フォントを変えるだけでガラッと雰囲気を変えることが出来ますよ。そこで大変便利なのが”google web fonts”です。(※アルファベットのみになります)

ワードプレスにgoogle web fontsを設定してみる

プラグインの新規追加から、WP Google Fontsをダウンロードします。

ダウンロードできましたら、wordpressの自分のサイトへ行き、
ダッシュボード→プラグイン→インストール済みプラグイン から、WP Google Fontsを”ネットワークで有効化”にします。それではGoogle Web FontsへGO!

ここから、気に入ったフォントを見つけて来て選ぶだけ。極簡単です!

webfonts
webfonts
webfonts

例えば、この一番上のフォントを使いたいとします。
Quick-useをクリック。font-familyを控えておきます。

WPのダッシュボードから設定を開くと一番下にGoogle fontsのタブが出来ています。

select font の▼から先ほど控えておいたfont-familyを探して、ちょっと下にあるsave
ボタンを押します。これでサイトのフォントが変わります。

このgoogle fontsのサイトへ行くと見ているだけで軽く一時間は過ぎてしまいます(笑)イメージにぴったりのフォントに出会うまで、色々試して悩むのもまた楽しいものです。

日本語のフリーフォントも、もっと充実するといいですね!

“ワードプレスにgoogle web fontsを設定してみる” への2件の返信

  1. 今ワードプレスを作っていますが、フォント変更できません。GooleFontsはダウンロードしています。
    もしよろしければ教えていただけないでしょうか?
    初対面でぶしつけなお願いですが、よろしくおねいします。
    福島県 大橋正幸

    1. 大橋さん、初めまして!
      コメントありがとうございます。しばらく放置中だったもので返信遅くなって済みません。
      私もWPについてはまだまだ勉強中の身ですので、情報交換宜しくお願いします。

      ご質問についてですが、手順としては、
      1.ダッシュボード→プラグイン→新規追加→検索欄に WP Google Fonts と入れ、検索。一番上に出てきますのでそれをインストール。
      2.プラグイン→インストール済みプラグインのページへ行き、一覧から WP Google Fonts を探してネットワークで有効化をクリックして有効化します。
      3.再びダッシュボード→設定をマウスオーバーする→Google Fontsが選択出来るようになっていますからクリック。
      4.ここでgoogle fontsのサイトへ行き、使いたいフォントを選びます。
      その後の流れは記事の通りです。
      記事作成当時とGoogle Fontsの設定画面が少々変わってはおりますが、基本的な使い方は一緒です。

      それでは、ご健闘をお祈りします。

kanosuke(freyja) へ返信するコメントをキャンセル