I'm in the process of trying to style a checkout page in Woocommerce and need the login form to be visible all the time when the user is not logged in rather than initially hidden then toggled on and off.

What I have discovered is that the login form is generated by Woocommerce's woocommerce_login_form function and then hidden on document load by checkout.js on line 83 $('p.password, form.login, .checkout_coupon, div.shipping_address').hide();. Since this is a core file of Woocommerce and will be overwritten on update I don't want to edit that one line of code but I cannot seem to find any better way of preventing it from hiding the login form. Since this occurs after my own Javascript files I cannot even simply show the form again.

Are there any better ways I can try and prevent the form from being hidden?

I'm in the process of trying to style a checkout page in Woocommerce and need the login form to be visible all the time when the user is not logged in rather than initially hidden then toggled on and off.

What I have discovered is that the login form is generated by Woocommerce's woocommerce_login_form function and then hidden on document load by checkout.js on line 83 $('p.password, form.login, .checkout_coupon, div.shipping_address').hide();. Since this is a core file of Woocommerce and will be overwritten on update I don't want to edit that one line of code but I cannot seem to find any better way of preventing it from hiding the login form. Since this occurs after my own Javascript files I cannot even simply show the form again.

Are there any better ways I can try and prevent the form from being hidden?

• jquery
• plugins

3 Answers 3

If you use a custom theme, you can create your own shop/form-login.php, and Woocommerce will use that. Then you can change the class names or add custom JavaScript. Upgrades for the core are still possible.

About the themeing, it's easy to override as @toscho said

About js file, you can easily denqueue the on your functions.php and enqueue your copy of the js file and then customize it to your liking and make sure it will not be over written on wc updates.

Override the template (wordpress/wp-content/plugins/woocommerce/templates/checkout/form-login.php) and change 'hidden' => true, to 'hidden' => false,

woocommerce_login_form(
    array(
        'message'  => esc_html__( 'If you have shopped with us before, please enter your details below. If you are a new customer, please proceed to the Billing section.', 'woocommerce' ),
        'redirect' => wc_get_checkout_url(),
        'hidden'   => true,
    )
);