2026年5月17日

WordPressのログインページをカスタマイズする方法｜ロゴ・デザイン・リダイレクト

カスタマイズ

WordPress のログイン画面（wp-login.php）には、初期状態で WordPress のロゴが表示され、ロゴをクリックすると WordPress.org に移動します。クライアントに納品するサイトや会員サイトでは、ロゴや色をサイトに合わせたり、ログイン後の移動先を変えたりしたいことがあります。

この記事では、WordPress のコアに用意されているフックを使って、ログイン画面を変更する方法を説明します。フック名と動作は2026年10月時点の WordPress 7.1 系の wp-login.php で確認しています。

コードを置く場所

ログイン画面の変更はテーマを切り替えると消えてしまうため、次のどちらかに置きます。

子テーマの functions.php：テーマと一緒に管理したい場合
自作の小さなプラグイン：テーマに関係なく残したい場合。wp-content/plugins/login-customize/login-customize.php などに保存し、「プラグイン」画面で有効にします

プラグインにする場合は、ファイルの先頭に次のように書きます。

<?php
/**
 * Plugin Name: Login Page Customize
 * Description: ログイン画面のロゴ・デザイン・リダイレクトを変更する
 */

// 直接アクセスされたら何もしない
if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

以下のコードは、このファイルか子テーマの functions.php に書き足していきます。書き間違えるとサイト全体が表示されなくなることがあるので、FTP や SSH でファイルを元に戻せる状態で作業してください。

ロゴを変更する

ログイン画面のロゴは、#login h1 a というリンクの背景画像として表示されています。login_enqueue_scripts アクションで、背景画像を上書きする CSS を追加します。

// ロゴの画像を差し替える
add_action( 'login_enqueue_scripts', function () {
	// カスタマイザーで設定したサイトロゴを使う（未設定ならテーマ内の画像）
	$logo_id  = get_theme_mod( 'custom_logo' );
	$logo_url = $logo_id
		? wp_get_attachment_image_url( $logo_id, 'full' )
		: get_stylesheet_directory_uri() . '/images/login-logo.png';

	$css = sprintf(
		'#login h1 a {
			background-image: url(%s);
			background-size: contain;
			background-position: center;
			width: 240px;
			height: 80px;
		}',
		esc_url( $logo_url )
	);

	// コアの login スタイルの後ろに出力する
	wp_add_inline_style( 'login', $css );
} );

wp_add_inline_style() は、ログイン画面のスタイル（ハンドル名 login）の直後に CSS を出力します。width と height はロゴの縦横比に合わせて調整してください。

あわせて、ロゴのリンク先とリンクテキストを変えます。

// ロゴのリンク先を WordPress.org からサイトのトップページに変える
add_filter( 'login_headerurl', function () {
	return home_url( '/' );
} );

// ロゴのリンクテキスト（スクリーンリーダーで読み上げられる）をサイト名にする
add_filter( 'login_headertext', function () {
	return esc_html( get_bloginfo( 'name' ) );
} );

login_headertext は、ロゴのリンクのテキストを変えるフィルターです（初期値は「Powered by WordPress」）。画面上では画像に隠れていますが、スクリーンリーダーで読み上げられます。以前の login_headertitle（title 属性を変えるフィルター）は WordPress 5.2 で非推奨になっています。このテキストはエスケープされずに出力されるので、esc_html() を通して返します。

CSS でデザインを変更する

背景色やフォーム、ボタンの見た目は CSS で変えます。CSS が長くなる場合は、子テーマに login.css を作って読み込むと管理しやすくなります。

// login.css を読み込む
add_action( 'login_enqueue_scripts', function () {
	wp_enqueue_style(
		'my-login',
		get_stylesheet_directory_uri() . '/login.css',
		array( 'login' ),
		'1.0.0'
	);
} );

依存に login を指定しておくと、コアのスタイルの後に読み込まれ、上書きが効きやすくなります。login.css の例です。

/* 背景色 */
body.login {
	background: #1a1a2e;
}

/* フォームの枠 */
.login form {
	border: none;
	border-radius: 8px;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

/* 入力欄 */
.login form .input {
	border-radius: 4px;
}

/* ログインボタン */
.login .button-primary {
	background: #0073aa;
	border-color: #0073aa;
	border-radius: 4px;
}

.login .button-primary:hover,
.login .button-primary:focus {
	background: #005a87;
	border-color: #005a87;
}

/* フォームの下のリンク（暗い背景で読めるようにする） */
.login #nav a,
.login #backtoblog a {
	color: #ccc;
}

.login #nav a:hover,
.login #backtoblog a:hover {
	color: #fff;
}

ボタンの色を変えるときは、文字と背景のコントラストが十分かを確かめてください。セレクターは WordPress のバージョンで変わることがあるので、更新後に画面を確認し、ブラウザーの開発者ツールで実際のクラス名を確かめて調整します。

メッセージとタブのタイトルを変更する

// フォームの上にメッセージを出す
add_filter( 'login_message', function ( $message ) {
	if ( empty( $message ) ) {
		$message = '<p class="message">' . esc_html( get_bloginfo( 'name' ) ) . ' の管理画面です。</p>';
	}
	return $message;
} );

// ブラウザーのタブに出るタイトルを変える
add_filter( 'login_title', function ( $login_title, $title ) {
	return $title . ' | ' . get_bloginfo( 'name' );
}, 10, 2 );

// 言語の切り替えメニューを表示しない
add_filter( 'login_display_language_dropdown', '__return_false' );

login_message は、パスワードのリセットなど、ほかの画面で WordPress が出すメッセージにも使われます。例では、ほかのメッセージがないとき（$message が空のとき）だけ独自のメッセージを出しています。言語の切り替えメニューは、サイトに複数の言語がインストールされているときに表示されます。

ログイン失敗時のメッセージをまとめる

初期状態では、存在しないユーザー名を入れると「ユーザー名が登録されていない」という趣旨のエラーが出るため、ユーザー名が存在するかどうかを推測される手がかりになります。メッセージを1つにまとめる例です。

// ログイン失敗時のメッセージをまとめる（ログインフォームの送信時だけ）
add_filter( 'login_errors', function ( $errors ) {
	if ( isset( $_POST['log'] ) ) {
		return 'ユーザー名またはパスワードが正しくありません。';
	}
	return $errors;
} );

login_errors は、パスワードのリセットやユーザー登録の画面のエラーにも使われます。すべてを置き換えると「メールアドレスを入力してください」のような必要な案内まで消えるので、例ではログインフォーム（入力欄の名前が log）の送信時だけ置き換えています。

ログイン後・ログアウト後の移動先を変更する

// ログイン後の移動先をロールで分ける
add_filter( 'login_redirect', function ( $redirect_to, $requested_redirect_to, $user ) {
	// ログインに失敗したときは WP_Error が渡される
	if ( ! ( $user instanceof WP_User ) ) {
		return $redirect_to;
	}

	// 元のページへ戻る指定（redirect_to）があれば、それを優先する
	if ( ! empty( $requested_redirect_to ) ) {
		return $redirect_to;
	}

	if ( in_array( 'administrator', (array) $user->roles, true ) ) {
		return admin_url();
	}

	if ( in_array( 'editor', (array) $user->roles, true ) ) {
		return admin_url( 'edit.php' );
	}

	// それ以外（購読者など）はトップページへ
	return home_url( '/' );
}, 10, 3 );

// ログアウト後の移動先をトップページにする
add_filter( 'logout_redirect', function ( $redirect_to, $requested_redirect_to, $user ) {
	if ( ! empty( $requested_redirect_to ) ) {
		return $redirect_to;
	}
	return home_url( '/' );
}, 10, 3 );

login_redirect の第3引数 $user は、ログインに失敗したときは WP_Error になるため、WP_User かどうかを確かめてから使います。
管理画面のページを開こうとしてログイン画面に回された場合は、redirect_to に元のページが入っています。これを優先しないと、ログイン後に元のページへ戻れなくなります。
ログアウト後の移動先は logout_redirect フィルターで変えます。wp_logout アクションの中で wp_safe_redirect() と exit を実行する方法は、ほかのプラグインのログアウト処理を飛ばしてしまうことがあるため、フィルターを使うほうが安全です。

WooCommerce を使っている場合、WooCommerce の「マイアカウント」ページからのログインは wp-login.php を通らないため、login_redirect は使われません。WooCommerce 側のフィルター（woocommerce_login_redirect）で設定します。

ハニーポットでボットのログインを減らす

人には見えない入力欄をフォームに置き、そこに値が入っていたらボットとみなしてログインを拒否する方法です。

// ハニーポット（人には見えない入力欄）でボットを止める
add_action( 'login_form', function () {
	?>
	<p style="position:absolute; left:-9999px;" aria-hidden="true">
		<label for="login_hp_website">Website</label>
		<input type="text" id="login_hp_website" name="login_hp_website" value="" tabindex="-1" autocomplete="off">
	</p>
	<?php
} );

add_filter( 'authenticate', function ( $user, $username, $password ) {
	if ( ! empty( $_POST['login_hp_website'] ) ) {
		return new WP_Error( 'login_hp_detected', 'ログインに失敗しました。' );
	}
	return $user;
}, 30, 3 );

authenticate フィルターでは、コアがユーザー名とパスワードを優先度 20 で確かめます。優先度 30 で WP_Error を返すと、パスワードが正しくてもログインは拒否されます。ハニーポットは単純なボットには効きますが、ログイン画面を読み取って動くボットには効かないことがあります。ログイン試行回数の制限や二要素認証と組み合わせてください。

ログイン画面の URL を変更・制限したい場合

wp-login.php の URL を変える処理を自作すると、パスワードのリセットやログアウトのリンク、ほかのプラグインとの組み合わせで不具合が起きやすくなります。URL を変えたい場合はプラグインを使い、管理者の IP アドレスが決まっている場合は Web サーバーの設定でアクセスを制限する方法もあります。Apache 2.4 の .htaccess では次のように書きます（IP アドレスは例です）。

<Files "wp-login.php">
    Require ip 203.0.113.10
</Files>

詳しい手順は関連記事を参照してください。

まとめ

コードは子テーマの functions.php か自作プラグインに置く
ロゴは login_enqueue_scripts で #login h1 a の背景画像を上書きし、login_headerurl と login_headertext でリンク先とリンクテキストを変える
長い CSS は wp_enqueue_style() で、依存に login を指定して読み込む
メッセージは login_message、タブのタイトルは login_title、失敗時のメッセージは login_errors で変える
ログイン後は login_redirect（redirect_to を優先）、ログアウト後は logout_redirect で移動先を変える
ハニーポットは login_form と authenticate で作り、試行回数の制限などと組み合わせる