本記事ではプラグイン「Japanese Font for WordPress （旧名：Japanese Font for TinyMCE）」（以下、JFW）を紹介します。
JFWを導入すれば、ビジュアルエディタ上で、手軽に気軽に手書きフォント等を用いた記事を作成することができます。
特にWordPress初心者向け。
「記事に他サイトと違ったフォントを使って個性を出したいけど、フォントの導入方法がよくわかんない」とか「めんどくさい」とか思っている方にはきっと重宝するでしょう。
Japanese Font for WordPressの機能
JFWは「Tiny MCE Advanced 」の拡張プラグインです。
従って、同プラグインのインストールが利用の前提となります。
ただしTiny MCE Advancedはビジュアルエディタを使うなら必須と言いうるプラグイン。
恐らく、多くの方が入れているでしょう。
手書きフォントなども予め入っています
また、CDNを活用することによって、外部フォントを利用する際にネックとなる速度低下にも対策がとられています。
Japanese Font for WordPressの利用法
利用法その１
通常、外部フォントを読み込むためには個別の設定が必要となります。
本ブログでも以下の記事で扱っています。
しかしこうした作業が「煩わしい」とか「難しい」という方も多いでしょう。
WordPress初心者でも記事内で外部フォントをお手軽に導入して使うことができるのがJFWの長所です。
利用法その２
こちらは中級者以上向け。
JFWは「フォントのテスト用」にも使えます。
実際にフォントを設定するまでは、具体的にどんなイメージになるかわかりません。
最初からサブセット化などの作業をするのは少々億劫なものがあります。
JFWがあれば（下記のフォントに限りますが）事前に試してみることが可能です。
CSSがある程度わかる方なら、記事以外でもフォントを使うことができます。
japanese-font-for-tinymceフォルダ内のaddfont.cssに設定があるので、style.css内で指定すればOK。
詳しくは後述します。
Japanese Font for WordPressに実装されているフォント
タイトルでは「手書きフォント」としていますが、その他のフォントも入っています。
具体的には以下の通り。
- ふい字フォント
- Noto Sans Japaneseの普通
- 同細字
- 同太字
- エセナパJ
- ほのか丸ゴシック
どのようなフォントかは下記画像を御参照ください。
ふい字フォントは当サイトでもタイトルや見出しなどに使っています。
Japanese Font for WordPressの導入・使い方
１ Tiny MCE Advancedをインストールする
なくても一部フォントは使えるらしいですが、どうせですので入れておきましょう。
２ JFTをインストールする
テンプレですが、一応書いておきます。
WordPress管理者画面サイドバーのプラグインをクリック
→新規追加をクリック
→プラグインを検索
→インストール
特に設定などは必要ありません。
インストール完了時点で使えるようになっています。
３ 記事内で使う場合
方法は通常のビジュアルエディタのフォント指定と同じ（あくまで拡張プラグインですので）。
具体的には下記画像を見て下さい。
４ 記事以外の場所へ使う場合
JFWのaddfont.cssにおけるフォントの設定は次の通り。
- ふい字フォント：Huifont
- Noto Sans Japaneseの普通：Noto Sans Japanese
- 同細字：Noto Sans Japanese-100
- 同太字：Noto Sans Japanese-900
- エセナパJ：esenapaj
- ほのか丸ゴシック：honokamaru
この中から使いたいフォントを選んで、style.cssに記述することで適用させます。
例えば弊サイトのタイトルに「ほのか丸ゴシック」を使いたい場合は、
.sitename{
font-family: 'honokamaru' ;
}
必要に応じて「!important」を加えます。
プラグインの作者様
@raspi0124 様。
サイトはこちら。
私とは「小説家になろう」繋がり。
活動報告にコメントいただいて見に行ってみたらWordPressのプラグインを作っていらっしゃった次第です。
先述の通り、特にWordPress初心者にとっては需要がありそうなので紹介させていただきました。
Japanese Font for WordPressへのリクエスト
作者様サイトのプラグイン説明ページに「新しく導入してほしいフォント」のアンケートがあるので、私からのリクエストを記しておきます。
手書きフォントとして利用者の多い「たぬきゴシック」など（→実装された様子です）- 商用OKの明朝フリーフォント
あと、作者様のページにもありますが、ロードするフォントの選択機能は実装してほしいところです。
その上で選択可能なフォントを増やせば利用者も増えると思います。（→最小限のフォントのみをロードする機能が実装されています）
まとめ
Japanese Font for WordPressは、その敷居を下げてくれるはず
よかったら使ってみて！
コメント