Woocommerce login

In fact, perhaps this might be easier….

Is there a way to enable this site-wide for all password fields?

Yes, I was hoping to use this for WooCommerce as well.

Bumping this. Came here looking for this exact same thing.

I believe this plugin can be extended to WooCommerce. After looking through its files and folders, I found …

1. “class-hide-show-password.php” enqueues the scripts and styles to the login page, like so …

// Load login screen style sheet and JavaScript.
add_action( 'login_enqueue_scripts', array( $this, 'enqueue_styles' ) );
add_action( 'login_enqueue_scripts', array( $this, 'enqueue_scripts' ) );

Instead of ‘login_enqueue_scripts’, it can be ‘wp_enqueue_scripts’, with a condition to check if the current page is WooCommerce “my-account” using is_wc_endpoint_url( 'my-account' )

2. The “/js/public.js” contains var el = $('#user_pass');, which is id to wp-login.php password input field. I think it can be changed to an array, such as var el = ['#password', 'reg_password'];. And change the rest of el. to $el.

I’m yet to test out these changes.

I performed the following hack to get this plugin to implement its function to all input[type=password], regardless of the front pages.

1. As suggested in my last comment above, change login_enqueue_scripts to wp_enqueue_scripts in “class-hide-show-password.php”,

// Load login screen style sheet and JavaScript.
add_action( 'login_enqueue_scripts', array( $this, 'enqueue_styles' ) );
add_action( 'login_enqueue_scripts', array( $this, 'enqueue_scripts' ) );

2. Then, in “/js/public.js” remark out var el = $('#user_pass');, but add var el = $('input[type=password]'); below it. This will search for all input fields with the password type.

I hope this will be a useful hack.

p.s.: I know that hacking plugins isn’t the ideal approach, but rather sensible approach to achieve its purpose. So, to @barryceelen, I sincerely apologise for doing this.

• This reply was modified 7 years, 5 months ago by Jason Wong. Reason: adding an apology

@barryceelen

I think the “enqueue_styles()” function in “class-hide-show-password.php” has a small mistake on line 104. Shouldn’t it be …

$suffix = ( $version >= '43' ) ? 'inner-toggle-genericon' : 'inner-toggle';

Since I’m currently on WordPress 4.8, the original code shows a square without any genericon. If I switch the statement outputs around, the genericon appears as it suppose to be.

@eljkmw What happens there is that the plugin loads its own slimmed down version of the Genericons icon font for WordPress versions lower than 4.3. Before that version, the Dashicons font only included the open eye icon, not the crossed out one.

I think you are missing the icon because the Dashicons font is not loaded on the page the login form is on.

The plugin currently does not explicitly add Dashicons as a dependency (although it probably should have) because it is already included on the default WordPress login page.

In stead of adding Dashicons as a dependency though, it may be more optimal to enqueue the ‘genericons’ version of the css on pages where the Dashicons font is not already included, as that will probably add less overhead.

I’ll see if I can make the plugin a bit more extensible, so it’ll be easier to use on other screens as well.

@barryceelen, you’re right that the Dashicons font isn’t enqueued.
I guess it’ll be straightforward fix with the snippet below.

add_action( 'wp_enqueue_scripts', function() {
	wp_enqueue_style( 'dashicons' );
});