クライアント用のワードプレス サイトを構築していますが、クライアントはログイン画面の外観を変えたいと考えているため、デフォルトのワードプレス ログイン フォームの外観を変更するにはどうすればよいかという質問があります。コア ファイルを変更したくありません。コア ファイルを変更せずにログイン フォームの外観を変更する方法はありますか。どんな種類の助けでも大歓迎です、ありがとう!
4 に答える
hook を使用して、コア ファイルを変更せずに、これらのコードをファイルlogin_head
内に追加するだけで実行できます。functions.php
function custom_login_logo() {
echo '<style type="text/css">
h1 a { background-image:url('.get_bloginfo('template_directory').'/yourImageFolder/login_logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_login_logo');
更新:また、ロゴのリンクを現在のサイトに変更するには、次のコード スニペットを使用します。
function custom_login_url() {
return get_bloginfo( 'siteurl' );
}
add_filter( 'login_headerurl', 'custom_login_url' );
このプラグインを見つけましたhttp://wordpress.org/extend/plugins/wp-custom-login-page/それはあなたが望むことをするようです。
css をオーバーライドすることでこれを行うことができます。functions.php に以下を追加することで、css をオーバーライドできます。
/**
* Login theme branding.
*/
function rt_login_css()
{
echo '<link type="text/css" rel="stylesheet" href="' . get_bloginfo('template_directory') . '/css/login.css" />';
}
add_action('login_head', 'rt_login_css');
ロゴは CSS イメージの背景を使用するため、CSS で上書きできます。
基本的に、login_head フックはログイン ページ用であり、ログイン css ファイルへのリンクをエコーするだけです。
そこから、firebug を使用して、使用されているスタイルを調べます。
欠点は、ここで完全に制御できないことです。css と可能な javascript でできることは何でも構いません。
また、ここに私のcssファイルの例があります:
h1 a {
background-image: url('/app/images/logo.png') !important;
width:330px;
height: 69px;
margin-bottom:0px;
}
#login {
margin: 5em auto;
}
ロゴを変えるだけなので、かなりシンプルです。通常、ロゴを正しく配置して間隔を空けるには、調整を行う必要があります。これは、他の css がここにあるものです。
さらに、独自のログイン ページを作成し、さまざまなワードプレス機能を使用して認証を処理することを検討することもできます。これは手間がかかりますが、ログイン フォームのルック アンド フィールを完全に制御できます。
欠点は、より多くの作業が必要であり、ユーザーが通常の WP 管理者ログイン ページにリダイレクトされた場合です。したがって、後者については、両方を行う必要があると思います。
WordPress のログイン ボックスをすばやく簡単にカスタマイズするために、プラグインBM Custom Loginを使用しています。このプラグインを使用すると、次のことができます。
- wordpress ロゴをカスタム イメージに置き換えます。
- ログインページに背景色/画像を追加できます。
- テキスト/リンクの影/色オプションを編集できます。
- 管理フッターのテキストを変更できます。(ログインすると、管理ページの下部に表示されます。)
このプラグインはコアファイルを変更しません