JQueryのダイアログウィンドウにログインフォームを表示するために wp_login_form()
を使用しています。
ユーザが間違ったパスワードを入力した場合、そのユーザはバックエンドに連れて行かれます。私はそれが欲しくありません。ユーザーが間違ったパスワードを入力しても同じページに残っていることをユーザーに通知する方法はありますか?
wp_login_form()
が来る前はプラグインを使っていました。このためにプラグインを使用しないようにできることを願っています。
私のコード:
wp_login_form( array(
'label_remember' => __( 'Remember me' ),
'label_log_in' => __( 'Login' )
) );
wp_login_form()
はaction属性がsite_url/wp-login.php
のフォームを作成します。つまり、送信ボタンをクリックするとフォームがsite_url/wp-login.php
に送信され、エラーが発生してもredirect_toは無視されます。ログインプロセス全体とその方法でエラーを制御できます。 カスタムログインフォームで正しいユーザー名を確認してください これは非常によく似た質問です。
私はグーグルからここに来ました。しかし、答えは私を満足させませんでした。私はしばらく探していて、もっと良い解決策を見つけました。
これをあなたの functions.php に追加してください:
add_action( 'wp_login_failed', 'my_front_end_login_fail' ); // hook failed login
function my_front_end_login_fail( $username ) {
$referrer = $_SERVER['HTTP_REFERER']; // where did the post submission come from?
// if there's a valid referrer, and it's not the default log-in screen
if ( !empty($referrer) && !strstr($referrer,'wp-login') && !strstr($referrer,'wp-admin') ) {
wp_redirect( $referrer . '?login=failed' ); // let's append some information (login=failed) to the URL for the theme to use
exit;
}
}
ここで概説した問題のすべてを処理するために現在使用している方法は、空白のユーザー名/パスワードでもうまく機能し、javascriptには依存しません(jsもこれと一緒に使用できます)。
add_action( 'wp_login_failed', 'custom_login_failed' );
function custom_login_failed( $username )
{
$referrer = wp_get_referer();
if ( $referrer && ! strstr($referrer, 'wp-login') && ! strstr($referrer,'wp-admin') )
{
wp_redirect( add_query_arg('login', 'failed', $referrer) );
exit;
}
}
重要なのは、空のユーザー名/パスワードの処理方法を変更するためのこのフィルタです。
add_filter( 'authenticate', 'custom_authenticate_username_password', 30, 3);
function custom_authenticate_username_password( $user, $username, $password )
{
if ( is_a($user, 'WP_User') ) { return $user; }
if ( empty($username) || empty($password) )
{
$error = new WP_Error();
$user = new WP_Error('authentication_failed', __('<strong>ERROR</strong>: Invalid username or incorrect password.'));
return $error;
}
}
これをさらに一歩進めて、ユーザーをカスタムログインページにリダイレクトし、そのページをlogin_failedリダイレクトにも使用することで、wp-login.phpを完全に置き換えることができます。フルコード:
/**
* Custom Login Page Actions
*/
// Change the login url sitewide to the custom login page
add_filter( 'login_url', 'custom_login_url', 10, 2 );
// Redirects wp-login to custom login with some custom error query vars when needed
add_action( 'login_head', 'custom_redirect_login', 10, 2 );
// Updates login failed to send user back to the custom form with a query var
add_action( 'wp_login_failed', 'custom_login_failed', 10, 2 );
// Updates authentication to return an error when one field or both are blank
add_filter( 'authenticate', 'custom_authenticate_username_password', 30, 3);
// Automatically adds the login form to "login" page
add_filter( 'the_content', 'custom_login_form_to_login_page' );
/**
* Custom Login Page Functions
*/
function custom_login_url( $login_url='', $redirect='' )
{
$page = get_page_by_path('login');
if ( $page )
{
$login_url = get_permalink($page->ID);
if (! empty($redirect) )
$login_url = add_query_arg('redirect_to', urlencode($redirect), $login_url);
}
return $login_url;
}
function custom_redirect_login( $redirect_to='', $request='' )
{
if ( 'wp-login.php' == $GLOBALS['pagenow'] )
{
$redirect_url = custom_login_url();
if (! empty($_GET['action']) )
{
if ( 'lostpassword' == $_GET['action'] )
{
return;
}
elseif ( 'register' == $_GET['action'] )
{
$register_page = get_page_by_path('register');
$redirect_url = get_permalink($register_page->ID);
}
}
elseif (! empty($_GET['loggedout']) )
{
$redirect_url = add_query_arg('action', 'loggedout', custom_login_url());
}
wp_redirect( $redirect_url );
exit;
}
}
function custom_login_failed( $username )
{
$referrer = wp_get_referer();
if ( $referrer && ! strstr($referrer, 'wp-login') && ! strstr($referrer, 'wp-admin') )
{
if ( empty($_GET['loggedout']) )
wp_redirect( add_query_arg('action', 'failed', custom_login_url()) );
else
wp_redirect( add_query_arg('action', 'loggedout', custom_login_url()) );
exit;
}
}
function custom_authenticate_username_password( $user, $username, $password )
{
if ( is_a($user, 'WP_User') ) { return $user; }
if ( empty($username) || empty($password) )
{
$error = new WP_Error();
$user = new WP_Error('authentication_failed', __('<strong>ERROR</strong>: Invalid username or incorrect password.'));
return $error;
}
}
function custom_login_form_to_login_page( $content )
{
if ( is_page('login') && in_the_loop() )
{
$output = $message = "";
if (! empty($_GET['action']) )
{
if ( 'failed' == $_GET['action'] )
$message = "There was a problem with your username or password.";
elseif ( 'loggedout' == $_GET['action'] )
$message = "You are now logged out.";
elseif ( 'recovered' == $_GET['action'] )
$message = "Check your e-mail for the confirmation link.";
}
if ( $message ) $output .= '<div class="message"><p>'. $message .'</p></div>';
$output .= wp_login_form('echo=0&redirect='. site_url());
$output .= '<a href="'. wp_lostpassword_url( add_query_arg('action', 'recovered', get_permalink()) ) .'" title="Recover Lost Password">Lost Password?</a>';
$content .= $output;
}
return $content;
}
パスワードを回復するためにwp-loginページにロゴを追加するには、これらをカスタマイズして追加します。
// calling it only on the login page
add_action( 'login_enqueue_scripts', 'custom_login_css', 10 );
function custom_login_css() { wp_enqueue_style( 'custom_login_css', get_template_directory_uri() .'/library/css/login.css', false ); }
// changing the logo link from wordpress.org to your site
add_filter( 'login_headerurl', 'custom_login_logo_url' );
function custom_login_logo_url() { return home_url(); }
// changing the alt text on the logo to show your site name
add_filter( 'login_headertitle', 'custom_login_title' );
function custom_login_title() { return get_option('blogname'); }
ログインロゴcss:
.login h1 a {
background: url(../images/login-logo.png) no-repeat top center;
width: 274px;
height: 63px;
text-indent: -9999px;
overflow: hidden;
padding-bottom: 15px;
display: block;
}
編集:私はちょうどこれを別のサイトのフォームのスクラッチに実装し、上記の「さらに一歩進む」がより完全であることを見出し、「add_actions」の小さな構文エラーを修正しました。別のテンプレートファイルを使用せずにログインページにログインフォームを自動的に追加するためのコメントとメソッドを追加しました。ログインフォームメソッドは "the_content"にアタッチされているので、ほとんどの場合うまくいくはずです。ログインページに複数のループがある場合は、それが発生して問題になるかもしれません。その場合はpage-login.phpテンプレートを使うだけです。
SzczepanHołyszewskiの承認されたソリューションの空のフィールドに関するポイントの解決策、次のjQueryは標準のwp-loginページに移動しないようにします。(ログインページtemplateまたはfooter.phpに追加)
jQuery("#loginform-custom").submit(function(){
var isFormValid = true;
jQuery("input").each(function()
{
if (jQuery.trim($(this).val()).length == 0){
jQuery(this).addClass("submit_error");
isFormValid = false;
}
else {
jQuery(this).removeClass("submit_error");
}
});
return isFormValid;
});
Alexeyの答えへの1つの追加。 jquery関数を追加して、いずれかのフィールドが空白になっていないことを確認できます。そうすれば、チェックするものがなければフォームは送信されず、WordPressは/wp-login.phpにリダイレクトできなくなります。
<script>
$("#wp-submit").click(function() {
var user = $("input#user_login").val();
if (user == "") {
$("input#user_login").focus();
return false;
}
});
</script>
それでも忘れたパスワードの側面を修正する方法がわからない