How to Allow Users to Hide/Show Passwords on WordPress Login Screen

Do you want to allow users to hide/show their password on your WordPress site’s various login screens?

WordPress automatically adds a show / hide password button to the default login page. However, you may want to add a hide/show password button to other login screens, particularly if you run a membership site or an online store.

In this article, we will show you how you can allow users to hide/show their password on different WordPress login screens.

What is the Hide/Show Password Button on the WordPress Login Screen?

Protecting your site with a long and complex password will make it more difficult for people to break into your WordPress website.

However, there are lots of different ways that people can try to steal your password. Sometimes, simply using a strong password isn’t enough to keep your website safe.

This is where the hide/show password feature comes in.

If you head over to your WordPress login URL and start typing in your password, you’ll notice that WordPress masks your password by default. Every number, letter, or symbol you type into the ‘Password’ field is shown as a dot.

Even if someone is watching the screen as you type, they won’t be able to see your password. This is particularly important if you’re logging into your WordPress blog in a public place such as a library.

However, sometimes it may help to show the user’s password as they’re typing.

The most secure passwords use a mix of upper and lower case letters, symbols, and numbers. These complicated passwords can be difficult to type without making any mistakes. By showing the password, users will be able to spot any typos or other mistakes before clicking the ‘Log In’ button.

The good news is that WordPress makes it easy to remove this masking. Simply click on the eye icon next to the ‘Password’ field, and WordPress will show the password as you’re typing.

To hide the password again, simply click on the eye symbol.

This feature works out-of-the-box for the standard WordPress login screen. However, there are other places where you may want to use the hide/show password feature.

With that being said, let’s look at how you can allow users to hide/show their password on some of the most common WordPress login screens. If you prefer to jump straight to a particular method, then you can use the links below.

• Method 1. How to allow users to hide/show passwords on WooCommerce login screen
• Method 2. How to allow users to hide/show passwords on membership login screens

Method 1. How to Allow Users to Hide/Show Passwords on WooCommerce Login Screen

Many online stores let customers save their information by creating an account. This makes it easier for the customer to buy from your online store in the future.

User registration can also be a way to get the visitor’s email address, so you can send them marketing emails and encourage them to buy more products and services. For more details, see our expert pick of the best email marketing services for small businesses.

If you’re using WooCommerce to create your store, then the plugin creates a My Account page automatically. If someone visits this page, WooCommerce will show them a login form as long as they’re not currently logged into an account.

If you look at the ‘Password’ field, then you’ll see a familiar hide/show password icon. The visitor can choose to hide or show their password, just by clicking on this icon.

Although WooCommerce creates the My Account page automatically, you may want to add the login form to other areas of your website. For example, you might want to encourage shoppers to log into their account when they try to checkout.

There’s also a chance you may have accidentally deleted WooCommerce’s default My Account page.

The good news is that you can add the WooCommerce login form to any page, post, or widget-ready area using the following shortcode:

[woocommerce_my_account]

For step by step instructions, see our beginner’s guide on how to add a shortcode.

Once you’ve added the shortcode, simply visit your website. You will now see a WooCommerce login form with a hide/show password button.

Method 2. How to Allow Users to Hide/Show Passwords on Membership Login Screens

A membership website is a way to make money online by allowing users to pay for premium content, features, and access to a community.

MemberPress is the best WordPress membership plugin. It comes with everything you need to accept payments, create different membership levels, restrict access to content based on those levels, and more.

It’s also easy to set up. For more information, see our step by step guide to creating a WordPress MemberPress site.

Once you’ve activated the plugin, MemberPress can automatically create all the pages you need to turn your WordPress website into an advanced membership site. This includes a login screen where members can choose to hide or show their password, as you can see in the following image.

To create a membership login page, simply go to MemberPress » Settings.

Then, click on the ‘Pages’ tab. You will now see all the pages that MemberPress can create automatically, including the MemberPress login page.

To go ahead and create all of these pages, simply click on the Update Options button.

Now if you go to Pages » All Pages, you’ll see that MemberPress has created a Login page where users can hide or show their password.

After creating a login page, it’s a good idea to add it to your WordPress menu so members can find it easily. For more information, you can see our guide on how to add a navigation menu in WordPress.

We hope this article helped you learn how to allow users to hide/show passwords on the WordPress login screen. You may also want to see our ultimate WordPress security guide and our expert picks of the best live chat software for small businesses.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.