WEBOPIXEL

WordPressのfunctionsファイルからログイン画面&管理画面のロゴ変更する。

Posted: 2010.07.28 / Category: WordPress / Tag: 

Wordpressでログイン画面や管理画面でオリジナルのロゴに変更したい場合は、コアファイルをカスタマイズしたりプラグインを使用する方法をお考えになると思われます。
しかし、コアファイルはバージョンアップしたときに上書きされるのでちょっと面倒だったり、プラグインは極力入れたくないといった考えもあるんじゃないでしょうか。
そんなときのためにテーマフォルダのfunctionsファイルからわりとお手軽に変更できる方法をご紹介します。

Sponsored Link

ログイン画面のロゴ変更

wordpressログイン画面

ログイン画面から変更していきましょう。まずは画像を用意します。
デフォルトのサイズは326×64なんでそれに近い大きさにした方が良いかもしれません。 画像ができたら使用しているテンプレートフォルダに適当な名前を付けて保存します。
ここでは「wp-login.png」という名前で保存しました。

そしてfunctions.phpに以下のコードを追加すれば完成です。

functions.php

		function login_logo() {
			echo '<style type="text/css">
				h1 a {
					background-image: url('.get_bloginfo('template_directory').'/wp-login.png);
				}
				</style>';
		}
		add_action('login_head', 'login_logo');
	

ご覧の通り画像はaタグの背景に指定してあるだけなんで、大きさはわりと柔軟に変更できると思います。

俺はロゴだけじゃなくてもっと色々カスタマイズしたいんだよーって場合は、CSSファイルを読み込むタグに変更すれば外部のCSSでいろいろいじりやすいんじゃないかなと思います。

functions.php

		function login_logo() {
			echo '<link rel="stylesheet" type="text/css" href="'.get_bloginfo('template_directory').'/wp-login.css" />';
		}
		add_action('login_head', 'login_logo');
	

管理画面のロゴ変更

wordpress管理画面

管理画面もログイン画面とやり方はほとんど同じです。
「login_head」が「admin_head」に変るだけですね。
画像のデフォルトサイズは32×32です。「wp-admin.png」という名前で保存します。
管理画面はログイン画面と違っていろいろと込み入っているので、画像サイズが大きくなると他の部分も色々と変更しないといけないかもしれません。

functions.php

		function admin_logo() {
			echo '<style type="text/css">
				#header-logo { background-image: url('.get_bloginfo('template_directory').'/wp-admin.png); }
				</style>';
		}
		add_action('admin_head', 'admin_logo');
	

COMMENTS

LEAVE A REPLY

コードを書く場合は<pre>で囲んでください。