So I want to apply a theme and style the lost password page without the use of a plugin. I don't want it to show the default Wordpress lost password page. I managed to style the login form by redirecting the URL to the styled version, but I'm lost as to how I can style the lost password page.

Any ideas?



The googles came up with this page: https://code.tutsplus.com/tutorials/build-a-custom-wordpress-user-flow-part-3-password-reset--cms-23811

Basically, you create a function that does the work of the lost password page. Then you call it with this:

add_action( 'login_form_lostpassword', 'my_lost_password_page' ) );
function my_lost_password_page() {
   // code to do the lost password stuff

You would place the above in your Child Theme's functions.php file.

You might be interested in the other parts of that tutorial, which discusses styling the login pages. Note that the tutorial uses a custom plugin to do all of the work, which is easiest, although you could do the same thing with code in your functions.php file. But the link might give you a starting point.

There are other links that might be useful, including the Codex: https://codex.wordpress.org/Customizing_the_Login_Form ; use that as a starting point for your efforts.


In the file wp-login.php we can see at line 586 the following:

     * Fires before the lost password form.
     * @since 1.5.1
     * @since 5.1.0 Added the `$errors` parameter.
     * @param WP_Error $errors A `WP_Error` object containing any errors generated by using invalid
     *                         credentials. Note that the error object may not contain any errors.
    do_action( 'lost_password', $errors );

At line 631 we have:

     * Fires inside the lostpassword form tags, before the hidden fields.
     * @since 2.1.0
    do_action( 'lostpassword_form' );

That means we can leave the form as is (to participate from the updates) and extend it with action hooks.

For example:

add_action( 'lostpassword_form', 'my_function_to_add_logo' ) );

Everything else depending to the layout can be done via css.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.