Do you want to customize the WooCommerce My Account page login form? In a WooCommerec store, most of the customers log in through the My Account login form but the default login form may not always align with a brand’s aesthetics and identity.
With the WP Login & Register and Navigation Menu widgets from The Plus Addons for Elementor, you can customize the login form that your customers can use to log in.
To check the complete feature overview documentation of The Plus Addons for Elementor WP Login & Register widget, click here.
Requirement – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.
Add the WP Login & Register widget to the My Account page or any other page that you want to use as the customer login page and follow the steps –
1. From the Forms Layout tab, select Login from the Type dropdown.
Note: You can also select Login and Register if you want to allow users to register from there as well.
2. Then select Standard Form from the Layout dropdown.
3. In the Login Options tab, enable the Redirect After Login toggle and add the My Account page URL.
Note: You can add a different URL if you want to redirect users to a different page.
Then customize the form as per your requirements.
4. Now enable the Display Condition extension from The Plus Addons for Elementor.
5. Then open the My Account page in Elementor.
6. Select the Woo My Account widget or the default WooCommerce My Account shortcode whichever you are using to show the My Account content.
7. Then Go to Advanced > Plus Extras : Display Condition.
8. Turn on the Display Condition toggle.
9. Select All Rules are True from the Display When dropdown.
10. Select Login Status from the first dropdown under the Rule tab.
11. Choose Is from the second dropdown.
12. Finally select Logged In from the last dropdown.
This will make sure the My Account content is only visible to logged in users and hides default the login and register form from the logged out users.
This is how easily you can customize the My Account login form.
Read Further: How to Show Google Sign-in with Both Login and Registration Forms in Elementor?
