How to show 'login error' and 'lost password' on my template page?

Question

I'm providing front-end login in a template, using the function wp_login_form. It handles the redirection after login and logout pretty neatly! But if the username / password mismatch, or are non existent, the user is redirected to the admin login page, with the shaky js error. Also same is the case when I'm trying to reset the password, it takes me to the me backend page where I have to enter my email for resetting the password. I want to show both these activities on my template. Is there a way I could do this?

Thanks for any help in advance.

Answer 1

Yes it's possible. You have to create three filters for this.

Admin stuff inside a class

class WPSE29338_Admin {
    public static function setup() {
        add_filter('login_url', array(__CLASS__, 'modifyLoginURL'), 10, 2);
        add_filter('lostpassword_url', array(__CLASS__, 'modifyLostPasswordURL'), 10, 2);
        add_filter('register', array(__CLASS__, 'modifyRegisterURL'));
    }

    public static function modifyLoginURL($loginUrl, $redirect = '') {
        $loginUrl = site_url('login'); // Link to login URL

        if(!empty($redirect)) {
            $loginUrl = add_query_arg('redirect_to', urlencode($redirect), $loginUrl);
        }

        return $loginUrl;
    }

    public static function modifyLostPasswordURL($lostpwUrl, $redirect = '') {
        $lostpwUrl = wp_login_url() . '#lostpassword'; // Link to lostpassword URL

        if(!empty($redirect)) {
            $lostpwUrl = add_query_arg('redirect_to', urlencode($redirect), $lostpwUrl);
        }

        return $lostpwUrl;
    }

    public static function modifyRegisterURL($registerUrl) {
        if(!is_user_logged_in()) {
            if (get_option('users_can_register')) {
                $registerUrl = '<a href="' . wp_login_url() . '#register" class="btn">' . __('Register') . '</a>'; // Link to register URL
            } else {
                $registerUrl = '';
            }
        }

        return $registerUrl;
    }
}

First we need to filter the output of the function wp_login_url() which is used by wp_login_form() in the forms action attribute.

Look at the method modifyLoginUrl(). Here we store the URL of the page login inside the variable $loginUrl. This page must exists inside WordPress, so create it first.

Next we need a filter for the function wp_lostpassword_url() and wp_register(). It's basically the same. The URL of the site is stored inside the variable $lostpwUrl and $registerUrl.

Last but not least, you have to call the class on the right action hook. For themes this should be after_setup_theme and for plugins you can use plugins_loaded.

Themes / functions.php

add_action('after_setup_theme', 'wpse29338_admin_init');
function wpse29338_admin_init() {
    WPSE29338_Admin::setup();
}

Plugins

add_action('plugins_loaded', 'wpse29338_admin_init');
function wpse29338_admin_init() {
    WPSE29338_Admin::setup();
}