WordPress の管理画面を自分の好きなフォントにするプラグイン

Category : CSS, WordPress

ネタ色が強いけど、WordPress の管理画面を自分の好きなフォントで表示するためのプラグインを作ってみたよ。
全然たいしたものじゃないので期待してはいけません。

作り直しましたので、こっちを使ってください。

今までマルチバイトパッチの admin.css をいじっていたんですど、アップグレードのたびに書き直すのも面倒なので、それ専用に1つ作りました。

それでは作ってみよう。

PHP ファイルを作成

適当な名前でフォルダを作成。
custom-admin-font とかでいいんじゃないですかね。

その後に同じ名前で PHP ファイルを作成。
コードは以下のように。

<?php
/*
Plugin Name: Custom admin font
Plugin URI: プラグインの URI
Description: 管理画面の font-family を変更するだけのプラグイン。
Version: バージョン
Author: 作者
Author URI: 作者の URI
*/

function custom_admin_font() {
	$url =  dirname(WP_PLUGIN_URL . '/' . plugin_basename(__FILE__)) . '/custom-admin-font.css';
	if(is_ssl()) {
		$url = preg_replace("/^http\:\/\//i", 'https://', $url);
	}
	echo "\n" . '<link rel="stylesheet" type="text/css" href="' . $url . '" />' . "\n";
}
add_action("admin_head", custom_admin_font);
?>

PHP はこれでよし。
日本語が混じっているときは保存するときの文字コードに注意。

CSS ファイルを作成

先に作った PHP ファイルで指定したファイル名(この場合は custom-admin-font.css)で CSS ファイルを作成して、PHP ファイルと同じフォルダに保存。
できたら中身を書いていきます。

body.wp-admin * {
	font-style: normal !important;
	font-family: Helvetica, Arial, meiryo, sans-serif !important;
}

body.wp-admin input[type="text"] {
	font-family: Consolas, Arial, Helvetica, monospase !important;
}

body.wp-admin textarea {
	font-family: Consolas, meiryo, Helvetica, Arial, sans-serif !important;
}

自分用のはこんな感じです。
全体の font-family を指定するときは body.wp-admin * という感じで class 名を指定しないとマルチバイトパッチにある admin.cssbody * より優先順位が下がるかもしれないので注意してください。
同様に、マルチバイトパッチ内 admin.css の各指定には !important が付いていますので、こちらも忘れずに書いてください。


これを使って自分が普段使っているブラウザや、インストールされているフォントに合わせて指定しておきます。

CSS を追加しているだけなので、指定すれば色々と変更できます。
特定の要素をハイライトしたりするのもいいかもしれませんね。

Leave a Reply