Theming the Wordpress login screen
How to force newly registered users to change their password on their first login.

Manage user profile and credentials

We recently required to force our newly registered users on a project to change their password on their first login.  This is handled by default in the WordPress core with the default password nag meta field,

update_user_option( $user_id, 'default_password_nag', true, true );

However, upon the first login the user is redirected to the wordpress default profile.php page which is not very intuitive, does not allow for customisation and more importantly is outside the scope of the template theme.

Template My Login to the rescue.

This is where I found a lovely little plugin, Template My Login (TML), which creates a set of pages with a simple shortcode in each of them. It creates a page for Login, Logout, Profile, Register and so on, allowing for each page to be automatically themed but also customised with a template.

Putting it all together.

Automatic registration of new users with auto-generated passwords can make a call to update the default password nag meta field,

update_user_option( $user_id, 'default_password_nag', true, true );

This can be called after a registration form, or within your code when you create a new user.
When a user logs-in for the first time they will be automatically redirected to their profile page.  Upon resetting their password, WordPress will automatically reset the default_password_nag meta field to null.

We can further modify the TML plugin default profile_form.php template to show a small message indicating that the user has been redirected to change their password if this is their first login,

<?php
/*
If you would like to edit this file, copy it to your current theme's directory and edit it there.
Theme My Login will always look in your theme's directory first, before using this default template.
*/
$nagPassword = null;
if ( is_user_logged_in( ) ) {
   //$user_ID = get_current_user_id();
   $nagPassword = get_user_option('default_password_nag');
}
?>
<div class="login profile" id="theme-my-login<?php $template->the_instance(); ?>">
<?php if($nagPassword) { ?>
    <p class="message">
        If this is your first log-in, you have been re-directed to your profile setting page in order to reset your password.
        &nbsp;
        Please choose a new password below
    </p>
<?php } ?>
    <?php $template->the_action_template_message( 'profile' ); ?>
    <?php $template->the_errors(); ?>
    <form id="your-profile" ....

The TML templates sit in the plugin folder, plugins/theme-my-login/templates just copy the relevant template to your theme folder and TML will first look there for the template file.  Easy as pie!

 

Want to share your thoughts?

Leave a Reply

Your email address will not be published. Required fields are marked *