WordPressのフォントを変更する3つの簡単な方法

公開: 2021-10-05

「WordPress でフォントを変更するには?」 は、最小限の技術知識を持つ人々の間で最も一般的なクエリの 1 つであり、その質問に対する適切な回答を次に示します。

この簡単な方法を使用して、WordPress のフォントを何度でも変更できます。

WordPress フォントを変更するには、[外観] メニューに移動し、[カスタマイズ] オプションをクリックして、[フォント] に移動します 選択したフォントを選択するか、 xマークをクリックしてデフォルトのフォントに戻すことができます。 目的の WordPress フォントを選択したら、[下書きを保存] ボタンをクリックして変更を保存します。

これがどのように見えるかです。

ワードプレスフォント

この記事ではさらに、WordPress フォントを変更する他の 3 つの簡単な方法について説明します。 それでは始めましょう。

関連: WordPress フッターの編集方法

WordPressでフォントを変更するには?

技術的には、WordPress サイトのフォントを変更する方法はたくさんあります。 ただし、ここでは、それを行うための非常に基本的な 3 つの方法について説明しました。 最も一般的なものから始めましょう。

1. サイトのテーマまたはページ ビルダーのフォント オプションで変更できる内容を確認する

ほとんどの人は、WordPress の既定のサイト テーマを使用していません。これは、ビジネス サイトには十分ではないからです。 これらのテーマは適切にコード化されていますが、どちらかというと概念的な部分にすぎません。 詳細については、e コマース CMS のガイドをご覧ください。

より簡単な言葉で言えば、ニーズに最も適した特定のタイプのテーマを選択することをお勧めします. プレミアムを選択すると優れたカスタマイズオプションが提供されますが、予算が限られている場合に選択できる無料のまともなオプションもあります.

これらのテーマのほとんどでは、WordPress サイトの適切なフォントを選択できる場所から、Google フォントのスイート全体にアクセスできます.

テーマを通じて WordPress のフォントを変更するには、通常 2 つの方法があります。 まず、カスタマイザーのメニューにアクセスして、そこからフォントを変更できます。 他のテーマには、アクセスする必要があるすべてのデザイン オプションを備えた専用の管理パネルが付属しています。

これらの管理パネルはナビゲートがはるかに簡単です。 関連するドロップダウン メニューをクリックして、選択したフォントを選択するだけです。 変更はすぐに発生する可能性があります。

Page Builder プラグインの動作もこれと非常によく似ています。 最も人気のあるものには、Elementor や Beaver Builder などがあります。

2. WordPress フォント プラグインをインストールする

テーマで提供されているフォントが気に入らない場合、WordPress フォントを変更する別の優れた方法は、専用のフォント プラグインをインストールしてアクティブ化することです。

通常、WordPress のプラグイン ディレクトリには、フォント埋め込みプラグインとフォント アップロード プラグインの 2 種類のフォント プラグインがあります。

フォント埋め込みプラグインを使用すると、Google Fonts などの専用ディレクトリから目的のフォントを取得して、サイトに埋め込むことができます。

その好例の 1 つが OMFG – Optimize My Google Fonts プラグインです。 さらに、Adobe のサブスクリプション フォントを使用しているユーザー向けのプラグインも用意されています。

サイトを Google または Adob​​e のサーバーに接続するには、追加の手順を実行する必要があることに注意してください。 ただし、これにより、フォントを手動で実装するときに発生する他のいくつかの手順を回避することもできます。

フォント アップローダ プラグインは、埋め込みプラグインとは大きく異なります。 これらのプラグインを使用すると、選択した特定のフォントをアップロードしてサイトで使用できるという名前ですぐにわかります. 関連する任意のプラグインで作業を行うことができますが、この作業で最も人気のあるプラグインは Google Fonts Typography Plugin です。

3. 簡単なコーディングによるカスタム フォントの追加

WordPress で手動でフォントを変更する方法を学習したい場合は、この最後の方法が最適です。 多少のコーディングが必要ですが、この方法の最も良い点は、非常に学習しやすいことです。 平均的な知識があれば、この方法を簡単に習得して実装できます。

欠点としては、専用のプラグインのプレミアム テーマ以外に幅広い選択肢が得られない可能性があります。 ただし、サイトを不必要なブロートウェアから遠ざけて、選択したフォントを使用することはできます.

このメソッドを実装するには、

  • CSS の平均的な知識
  • Web サイトに埋め込みたいフォント
  • WordPress コアへのアクセス
  • FTP (ファイル転送プロトコル) に関するある程度の知識

例を挙げて説明しましょう。 Google フォント「Oswald」を選択するとします。

埋め込みたいスタイルを選択します。 太字、標準、斜体のスタイルを選択することをお勧めします。 スタイルを選択したら、フォントを埋め込む最も簡単な方法は、[埋め込み] タブをクリックしてコードをサイトのセクションにコピーすることです。

ただし、エンキュー方式を使用することをお勧めします。 この方法では、まずリンクをフォントにコピーする必要があります。 これが例です

「https://fonts.googleapis.com/css2?family=Oswald:wght@200;700&display=swap」

次に、FTP を使用して WordPress サイトのファイルにアクセスする必要があります。 ここから、子テーマのルート ディレクトリを開き、 functions.php にアクセスする必要があります。

functions.phpファイルを開いたら、次のコードを入力します。 (例に記載されているリンクを選択したフォントに置き換える必要があることに注意してください。)

関数 add_my_font() {

wp_enqueue_style( 'add_my_font', 'https://fonts.googleapis.com/css2?family=Oswald:wght@200;700&display=swap', false );

}

add_action( 'wp_enqueue_scripts', 'add_my_font' );

最後のステップは、フォントを使用する場所を宣言することです。 この目的を達成するには、子テーマのルート ディレクトリにあるstyle.cssファイルにアクセスし、以下を追加する必要があります。

.body, .h1, .h2, .h3, .h4 {

font-family: 'Oswald', sans-serif;

}

通常、これにより、この特定のフォントを特定のスタイルで使用したいことが Web サイトのフロント エンドに通知されます。 すべてのセクションに新しいフォントを適用したくない場合は、宣言を削除することもできます。

適切な WordPress フォントを選択する必要がある 2 つの重要な理由を次に示します。

Web デザインで適切なフォントの選択が重要な理由

開発の知識がほとんど、またはまったくない人にとって、Web サイトのデザインは、配色、フォントの選択、およびナビゲーション バーの設定という単純なプロセスのように聞こえるかもしれません。

ただし、美学以外にも効果的なウェブサイトのデザインを作成するには多くの作業が必要になるため、それほど簡単ではありません。 WordPress サイトのフォントを選択するときは、読みやすさ、マーケティング、フォントがブランドと一致するかどうかなどの要素を考慮する必要があります。

具体的には、フォントがサイトのデザインに影響を与える主な方法が 2 つあります。 それらについて話しましょう。

1. 使いやすさ

ユーザビリティは、フォントの選択が影響する最も重要な側面です。 読みにくいフォントを選択するとします。 あなたの見込み客は、欲求不満からあなたのサイトを放棄し、代替案を探す可能性が最も高い.

2. ブランディング

読みやすさも重要ですが、フォントがブランドのトーンとどのように関連性があり、スタイリッシュに見えるかにも注目する必要があります。 サイトのフォントをより簡単な言葉で選択する際に、さまざまな側面を考慮することをお勧めします。

オーバー・トゥ・ユー

ほらね。 WordPress でフォントを変更する 3 つの簡単な方法をご紹介します。 ベスト プラクティスは変化し続けることを覚えておくことも同様に重要です。したがって、これらの方法と提示された内容との間に相違がある場合は、専門家のアドバイスを受けることをお勧めします。

また、WordPress ホワイト スクリーン オブ デス エラーやホワイト ラベルの修正などのガイドを読んで、知識を高めてください。