いろいろなページで適用のさせ方が紹介されているものの、原則theme.jsonでフォントを指定するブロックテーマではどうやるの?という情報がなかなかなさそうなので、実際に入れて試してみました。やり方は間違ってないと思いますが、必要な方の参考になれば幸いです。Fontsなどのオプションフォントを簡単にインストールすることができるようになりました。Fontsを導入すると、以下のことができるようになります。Fontsのフォントを日本語フォントの第一候補としてサイトへ表示できるようになる2は応用編なので、ひとまず各所で任意にGoogleフォントを使いたいという方はそれほど難しいことなく設定できますよ。当初、外部リンク経由でも行けるのでは?と考えて実装してみましたが、適用されず、theme.jsonでのフォントの読み込みは、ローカル(サイト内)のファイルを参照する必要があります。JP」のフォントファイルをダウンロードします。ダウンロードしたら解凍しておきましょう。ファイルの変換ダウンロードした中にある「ttf」という形式のファイルは重過ぎるので、「woff2」という形式のファイルへ変換します。変換には「WOFFコンバータ」という変換ツールが便利です。ここでストップ!!基本的にはダウンロードした中の「NotoSansJP-Regular.ttf」というファイルのみを使い、これを「woff2」へ変換するのですが、変換しても2.2メガバイトもあり、とても実用には足りません(巨大なファイルを転送することになるので、アクセスしてくれた人に迷惑がかかります)。そこで、「日本語WEBフォントをサブセット化する際の参考文字列一覧」に掲載されている「JIS第1水準+常用漢字+その他でまとめると(3759字)」だけを使うようにして軽量化します。軽量化には「WOFFコンバータ」と同じところで提供されている「サブセットフォントメーカー」というツールを使います。「サブセットフォントメーカー」で、「NotoSansJP-Regular.ttf」を「JIS第1水準+常用漢字+その他でまとめると(3759字)」だけにしたファイルを作る「WOFFコンバータ」で「woff2」形式に変換するどちらのツールも簡単に使えるように設計されていますが、ツールをパソコンへインストールするのが嫌!という方やツールの使い方が分からないという方もいるでしょう。そこで、私が作成したものでよければ以下からダウンロードできるようにしておくので、必要な方を使ってください。累計ダウンロード数:40回ダウンロードしたら、解凍しておいてください本来は自身で作成されることをおすすめします。不具合や何等かの不都合があっても一切責任は持ちませんので、使用の判断は自己責任でお願いしますここから先は、「JIS第1水準+常用漢字+その他」側をダウンロードした前提で話を進めますので、自身で作成した方は置き換えて考えてください。フォントファイルのアップロードまずは解凍後のフォルダ名を「noto-sans-jp」に変更してください。変更後以下のようなフォルダ&ファイル構造になっているか確認してください。Twenty-Three」のフォルダにある以下の階層へアップロードしてください。「twentytwentythree」フォルダ「assets」フォルダ「fonts」フォルダ「noto-sans-jp」フォルダこれで前準備(フォントファイルの準備)は完了です。1.Googleフォントをエディターの「フォント」で選択できるようにするGoogleフォントを追加するには、まず、「theme.json」でフォントの指定がどのようにされているかを理解する必要があります(読み飛ばしてもいいですが、後で苦労することになるかも知れません..)。Sans」などのオプションフォントが用意されていて、エディターから選択できるようになっています。これに該当するtheme.jsonの記述は以下の部分でひとまとまりになっています。"dm-sans"},おおまかにいうと、「fontFace」と「fontFamily」で1つのフォントの設定がされています。いずれかが指定されたときにどのファイルにある文字を呼び出して表示するかという設定です。「fontFamily」は「name」に指定されている名前がエディター上の「フォント」に表示され、それをクリックしたときにどうするか?というのを指定しています。sans-serif」というフォントが割り当てられるという仕組みなんですね(「slug」はスタイルの出力で重複しないよう一意のものを指定していますからここではあまり気にしなくてもいいでしょう)。JP」を選択できるようにするコードを挿入していきましょう。以下が必要なコードです。JP」が使用可能になっているはずです。JP」には斜体がないこと、また、太字の指定は「太字(B)」スタイルをエディターで選択したらきちんと太字になるので、上記の記述のままで大丈夫そうです。JP」のみで構わないかと思いますが、もしも..と感じる方は以下のようにしてファミリ指定をしておくといいでしょう。sans-serif",実装すると、ブロックエディターでこんな風に選択できるようになります。2.Googleフォントをサイト全体の通常フォントとして使用できるようにする前項で、Googleフォントが使用できるようになったので、この際サイトのいろいろな場所のフォントをGoogleフォントに変えてしまいましょう。"1.6"}「system-font」の部分を、上記のコードの場合で言えば、「slug」に指定した「google-noto-jp」に変えるだけです。🡅WordPress6.5以降ではもっと簡単に追加が可能になったWordPress6.5以降では、サイトエディターからオプションフォントの追加ができるよう機能強化されました。以下のページで追加や管理の方法などを詳しく紹介していますので、参考にしてみてください。以上がGoogleフォントをtheme.jsonで使用する手順です。JP」とで大きく違うのは、ひらがなの「き」と「さ」などですので、文字を拡大するなどしてきちんと適用されるかを確認しましょう。Twenty-Three)の親テーマ内にフォントファイルを転送して、theme.jsonを編集しましたが、このままだと将来テーマの更新が行われ、サイトでTT3テーマを更新した際にフォントがすべて無効になりますので、テーマをエクスポートして別テーマ化するなりして対応してください(これについては主旨から外れるので割愛します)。グローバルスタイルで指定しているとtheme.jsonの追記が無効になる?これは恐らくWordPress6.5以降でサイトエディター上からのフォントの追加・削除機能が追加されたことによる仕様変更かと思われますが、グローバルスタイルとtheme.jsonのどちらを優先にするかを明確にするための措置として、グローバルスタイルでフォントの何かを変更して保存すると、以降theme.jsonの内容は無視されるようです。以下でも書いていますが、この不具合が発生した場合はグローバルスタイル設定をクリアすることでtheme.jsonの内容が再反映されるようにはなるものの、他のスタイル設定も同時にクリアされてしまう可能性があります(そこまでチェックはしていません)のでご注意を。theme.jsonで追加したはずのフォントが認識されないときは(メモ)本ページで掲載した内容や、紹介した参考コードなどがお役に立てたようでしたら、ページ末尾のコメント欄よりコメントを残す、SNS等で拡散するなどしていただけましたら幸いです。本ページ掲載の方法やコード等はあくまでも最終更新日時点での私の環境において動作確認等を行ったものです。動作不良やカスタマイズの詳細な方法などをコメント欄よりいただきましても原則回答は致しませんのでご了承ください。WordPressのカスタマイズに関するご要望はココナラにてお受けしております。お問い合わせ方法など詳しくはこちらをご覧ください。最後までお読みいただきありがとうございました。Tenテーマがデフォルトになる前と結構な期間お世話になっています。興味に応じて、いろいろなサイト作っては壊しを繰り返しながら、独自テーマの作成やプラグインの作成などを行っています。Utility】プラグインの紹介などをしています。コメントをキャンセルメールアドレスが公開されることはありません。次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。(PWCN)WordPressで実際に行ったカスタマイズの記録、発生したトラブルに対処した時のメモ、ブロックテーマのカスタマイズなどこのスライドメニューは以下のページの方法を使って実装しています。以下のページでタブ切り替え式のコンテンツの作り方を公開しました。Utility】プラグインをバージョン5.1へ更新しました。