Using a long password with lots of special characters can prevent others from breaking into your WordPress site. However, a strong password is not enough to secure your website. There are many other ways people can steal your password. Toggling password visibility comes in handy in such cases.
Let’s see it in action!
- Show/Hide Passwords on WordPress Admin Login Screen
- Toggle Password Visibility on WooCommerce Login Screen
- Toggle Password Visibility on Membership Login Screen
Show/Hide Passwords on WordPress Admin Login Screen
When entering a password in the admin login screen, the default WordPress already supports you to hide your password with dots in the Password field. This helps you secure your password and prevent others from seeing it as you’re typing.
To increase security, you often use long passwords with many special characters, including numbers, symbols, uppercase, lowercase letters, etc. Therefore, it is sometimes difficult for you to type passwords without making any mistakes.
By showing the password, you will easily detect and fix any typos or other mistakes before clicking the Log In button. Simply select the eye icon next to the Password field, you’ll be able to display the passwords.
Not only the WordPress admin login screen, there are other screens where you want to toggle password visibility. Check out how you can show/hide passwords on some of the most common WordPress login screens!
Toggle Password Visibility on WooCommerce Login Screen
WooCommerce is one of the leading eCommerce platforms today. It has gained rapid popularity over the years.
WooCommerce has almost everything you need for your online store. This is how the default WooCommerce registration and login form looks like.
If you look at the Password field, you will see a familiar hide/show password eye icon. Visitors can choose to toggle their password just by clicking on this icon.
Although WooCommerce creates the My Account page automatically, sometimes you want to add login forms to other areas of your Woocommerce site. Or you may have accidentally deleted the default My Account page.
In these cases, toggling password visibility on the WooCommerce login screen will be easier with the help of the User Registration plugin. User Registration is an incredible WordPress online registration plugin. It makes the registration process for website owners and visitors effortless. The simple drag and drop form builder alongside the user-friendly interface provides you with an easy way to create forms.
Most importantly, it’s fully compatible with WooCommerce. So, you can use its WooCommerce add-on to customize the WooCommerce registration and login form. You can then replace the default form with the custom form and sync it with WooCommerce in no time. Take the following steps to add a hide/show password eye icon to the Woocommerce registration and login screens:
Firstly, you have to follow these steps to install the plugin:
- Login to your WordPress admin dashboard.
- Click the Plugins button, then choose the Add New option from the left side menu of the admin dashboard.
- Search for the User Registration – Custom Registration Form, Login Form And User Profile For WordPress plugin.
- Click on the Install Now button.
- When the installation is complete, click on the Activate button.
After successfully installing the plugin, in the WordPress admin dashboard, navigate to WooCommerce → Settings → User Registration. In the General menu, make sure to turn off the Disable Show Password option. Now, the eye icon feature appears on both the Woocommerce login form and registration form.
Toggle Password Visibility on Membership Login Screen
A membership website is a way to make money online by allowing users to pay for premium content and functions. It also offers users access to protected content when they sign up. Protected content on a membership website can be available for free or for a fee. It can be your whole site or just a few parts of it.
We’ve published an article on how to build a membership site with the PPWP plugin. Check it out now!
PPWP helps you password protect any content on your WordPress site. It also provides you with a password reveal button that allows your users to hide/show passwords when they’re typing.
Follow the instructions below:
- In the WordPress admin menu, go to Appearance → Customize.
2. Select PPWP Single Password Form in the left-hand sidebar.
3. Click Password Form, scroll down to the Show Password section and enable the Show Password Reveal Button.
Besides the hide/show password feature, you can customize your password form, error message, and submit button with the PPWP plugin.
Password Form
This option allows you to change the background format, edit the headline as well as the description above/below the form. You can also customize the password field. Specifically, in the password field, you can modify the text next to the password field as well as the placeholder.
Error Message
Error Message will appear when users enter the wrong password. It is a red line saying “Please enter the correct password!”.
The default message is set on the plugin’s Settings page. You can change it in the Error Message section. You can also change the format of the Error Message including Font Size, Font Weight, Text Color, and Background Color.
Submit Button
You can customize the button style, label, text color, and background color.
Easily Toggle Password Visibility in WordPress with Plugins
We have recommended some powerful plugins to help you toggle password visibility in different WordPress login screens without effort.
The plugins we’ve suggested offer almost all the features you need including the show/hide password feature. We hope that you’ll find it helpful.
If you still have a question on how to toggle password visibility in WordPress, don’t hesitate to leave a comment below – we are always ready to help!
