ビジュアルエディターで、google font クラスを入力するボタンを作る。

Raindropsテーマでは、htmlのグーグルフォントクラスを適用すると、投稿で指定するだけでいろいろなフォントを利用することが出来ます。

クラス名は、のとさんずジャパニーズのボールドなら、google-font-noto-sans-japanese800 と書けばいいわけですが、しょっちゅうテキストエディタでクラスを記述するのも、面倒といえば面倒ですね。

今回は、ビジュアルモードで、ボタンからクラスを追加するフィルターについて説明します。

コードは、とても短いものです。functions.phpに以下のコードを追加します。

これで、スタイル というボタンが表示されるようになります。

次に、適用範囲を解かりやすくするために、editor-style.css に以下のスタイルを記述します。

editor-style.cssの末尾に追加します。

後は、下書きボタンかプレビューを表示していただくと、フォントが適用されていると思います。こんな感じです。

editor-2

関連


コメントは受け付けていません。