■ビジュアル画面のメニューボタンで日本語フォントファミリーが別途指定できない問題
懸案だった表示は、[ビジュアル]画面でも見やすいフォントへ変更できました。
前回の備忘録[2]を参照。
http://mansion.eduplan21.net/cam/mylinks/singlelink.php?cid=6&lid=29ただ、投稿やページ編集の際に、[ビジュアル]画面上のメニューボタン[フォントファミリー]をクリックしても、プルダウンボタンで表示されるフォントには、日本語フォントは反映されておらず、英語フォントしか選択できません。
WEB上で情報収集して、いろいろ試しましたがうまくいきませんでした。
【手順4】
TinyMCEにフォントを追加できるプラグインがないか探していましたら、[KVTinyMCE Editor Add Fonts]というプラグインが見つかり、試してみたところうまくいきました。備忘録として記しておきます。
?ダウンロード
ダウンロード先:
https://wordpress.org/support/view/plugin-reviews/kv-tinymce-editor-fonts?filter=5またはサーチ欄に、[KVTinyMCE Editor Add Fonts]を入力して検索
https://wordpress.org/plugins/search.php?q=?プラグインファイルの修正
・ダウンロードしたzipフィアルを解凍したフォルダーの中に、 ・kv_fonts.php があります。
・UTF-8形式のテキストが編集できるエディターで、たとえば以下のように変更します。
------------------------------------------------
// helps you to add the custom font to your tinyMCE editor.
function kv_add_google_webfonts_to_editor()
{$kv_google_selected_fonts_list = array('メイリヨ','ヒラギノ角ゴ+Pro','MSゴシック','MS明朝','MS+UI+Gothic','Open+Sans', 'Josefin+Slab', 'Arvo' , 'Lato', 'Vollkorn', 'Ubuntu', 'Old+Standard+TT' , 'Droid+Sans' , 'Roboto', 'Oswald' , 'Source+Sans+Pro');
foreach($kv_google_selected_fonts_list as $kv_font) {
$font_url = '
http://fonts.googleapis.com/css?family='.$kv_font.':300,400,700';
add_editor_style( str_replace( ',', '%2C', $font_url ) );
}
}
add_action( 'init', 'kv_add_google_webfonts_to_editor' );
function kv_custom_font_list($in)
{ $in['font_formats']= 'メイリヨ=meiryo;ヒラギノ角ゴ Pro=Hiragino Kaku Gothic Pro;MSゴシック=MSゴシック;MS明朝=MS明朝;MS UI Gothic=MS UI Gothic;Open Sans=Open Sans; Josefin=Josefin; Slab=Slab; Arvo=Arvo; Lato=Lato; Vollkorn=Vollkorn; Ubuntu=Ubuntu; Old Standard TT=Old Standard TT; Droid Sans=Droid Sans; Roboto=Roboto; Oswald=Oswald; Source Sans Pro=Source Sans Pro' ;
$in['fontsize_formats'] = "9px 10px 12px 13px 14px 15px 16px 17px 18px 20px 21px 24px 28px 32px 36px";
return $in;
}
add_filter('tiny_mce_before_init', 'kv_custom_font_list' );
------------------------------------------------
「'メイリヨ','ヒラギノ角ゴ+Pro','MSゴシック','MS明朝','MS+UI+Gothic',」
「メイリヨ=meiryo;ヒラギノ角ゴ Pro=Hiragino Kaku Gothic Pro;MSゴシック=MSゴシック;MS明朝=MS明朝;MS UI Gothic=MS UI Gothic;」が追加部分です。
フォントの拡大間隔は現状のままか適当に増減。
(オリジナルのkv_fonts.phpは別フォルダーに保存しておくとよいでしょう。)
?サーバの /plugins フォルダーへ /kv-tinymce-editor-fontsフォルダー毎アップロードして、[KVTinyMCE Editor Add Fonts]を有効化します。
投稿またはページ編集で[ビジュアル]画面にして、メニューボタンの[フォントファミリー]をクリックすると、追加した日本語フォントが選択できると思います。
実際にある文字列を反転させて日本語フォントを適用すると、[テキスト]画面では、該当日本語フォントのタグが追加されていることが確認できると思います。
管理画面[KvCodes]をクリック、追加した英語フォントは追加リストに表示されますが、日本語フォントファミリーはどういうわけかリストには載らないようです。
実際に使えますので、良しとします。
?うまく表示されない場合は、[KVTinyMCE Editor Add Fonts]と[TinyMCE Advanced]を一度停止(無効)にして、ブラウザのキャッシュをクリアする。[KVTinyMCE Editor Add Fonts]→[TinyMCE Advanced]の順にプラグインを有効にして投稿やページ編集で確認してみてください。
これで、会員の方にもどしどし投稿してもらえるようになると嬉しいのですが…
以上、参考まで。
実施の際は、必要なバックアップを取って、自己責任でお願いします。
-------------
[環境]
WordPress日本語版 Ver.3.9.1
TinyMCE Advanced Ver.4.0.2
KVTinyMCE Editor Add Fonts Ver.1.0
InternetExplorer Ver.10
FireFox ver.29