How to Change the Color of the Message Box on the Password Reset Page

Introduction

BuddyBoss uses the default WordPress message box style on the Password Reset page. You can change the background and border color of this message box by adding a small custom function to your active theme. This ensures that the message box matches your site’s branding or improves visibility for your users. This guide explains how to change the color of the message box on the Password Reset page.

Custom Workaround

Before proceeding, make sure you have a complete site backup.

1. Go to Appearance > Theme Editor in your WordPress admin dashboard.
   
2. Under Select theme to edit, choose your active theme (preferably BuddyBoss Child Theme), then click Select.
   
3. From the Theme Files list, open Theme Functions (functions.php).
   
4. Add the following code just before the closing PHP tag (?>):
   

add_action( 'login_head', 'customLoginStyle' ); 

function customLoginStyle() { 

    echo "<style type='text/css'> 

        .login:not(.login-action-lostpassword) .message:not(.reset-pass), 

        .login.login-action-lostpassword .message > .message { 

            background-color: #000 !important; 

            border-color: #000 !important; 

        } 

    </style>"; 

}

5. Click Update File to save the changes.

Note: Modifications are typically considered custom work, but we are making an exception in this case. Please review the BuddyBoss Support Policy.

Troubleshooting and FAQs

Q: The color did not change after adding the code.
A: Clear your browser cache and any caching plugins, then refresh the page.

Q: Can I use a different color?
A: Yes. Replace #000 in the code with any hex color code you prefer.

Q: Will this affect other login messages?
A: The code targets only the Password Reset message box; other login messages remain unchanged.