---
title: "How to Customize the WooCommerce My Account Page Login Form?"
url: https://theplusaddons.com/docs/customize-the-woocommerce-my-account-page-login-form/
date: 2024-05-17
modified: 2026-04-09
author: "Aditya Sharma"
description: "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..."
image: https://theplusaddons.com/wp-content/uploads/2024/05/How-to-Customize-the-WooCommerce-My-Account-Page-Login-Form-1024x536.jpg
word_count: 394
---

# How to Customize the WooCommerce My Account Page Login Form?

## Key Takeaways

- The Plus Addons for Elementor includes the WP Login & Register widget for customizing the WooCommerce My Account page login form.
- The Display Condition extension from The Plus Addons for Elementor ensures My Account content is visible only to logged-in users.
- Users can select 'Login' from the Type dropdown in the Forms Layout tab to customize their login form.

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](https://theplusaddons.com/docs/create-a-login-register-form-in-elementor/).*

***Requirement  - This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/elementor-login-form/)

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.

![](https://theplusaddons.com/wp-content/uploads/2024/05/wp-login-register-login.gif)

> *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](https://theplusaddons.com/docs//display-conditions-settings-overview/#How-to-Activate-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](https://theplusaddons.com/docs/edit-woocommerce-my-account-page-in-elementor/) widget or the default WooCommerce My Account shortcode whichever you are using to show the My Account content.

![](https://theplusaddons.com/wp-content/uploads/2024/05/woo-my-account-display-condition.gif)

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?](https://theplusaddons.com/docs//show-google-sign-in-with-both-login-and-registration-forms-in-elementor/)*

## Frequently Asked Questions

**Q: What if the WP Login & Register widget doesn't appear on my My Account page?**
A: If the WP Login &amp; Register widget is not displaying, ensure that The Plus Addons for Elementor is installed and activated. This widget is essential for customizing the login form. Additionally, check that you've added the widget to the My Account page correctly and that the Display Condition extension is enabled to control visibility based on user login status.

**Q: Can I use the WP Login & Register widget for both login and registration?**
A: Yes, you can configure the WP Login &amp; Register widget to allow users to log in and register from the same form. Simply select 'Login and Register' from the Type dropdown in the Forms Layout tab. This feature enhances user experience by streamlining the login and registration process in one location.

**Q: What happens if I don't set a redirect URL after login?**
A: If you don't set a redirect URL after login, users will remain on the same page after logging in. This can lead to confusion as they might expect to be taken to a specific area, like the My Account page. To improve navigation, enable the Redirect After Login toggle and specify the desired URL, such as the My Account page URL.

**Q: What are the best practices for customizing the My Account login form?**
A: When customizing the My Account login form, ensure that the design aligns with your brand identity. Use the WP Login &amp; Register widget from The Plus Addons for Elementor and select a layout that suits your site's aesthetics. Additionally, enable the Display Condition extension to control visibility based on login status, which helps maintain a clean user interface.

**Q: Does the My Account page customization work on mobile devices?**
A: The customization of the My Account page using The Plus Addons for Elementor is responsive and should work on mobile devices. However, always preview your changes in mobile view to ensure that the login form displays correctly and is user-friendly on smaller screens.

**Q: What should I do if I want to hide the login form for logged-out users?**
A: To hide the login form for logged-out users, enable the Display Condition extension from The Plus Addons for Elementor. Then, set the Display When dropdown to 'All Rules are True' and configure the rules to show content only when users are logged in. This setup ensures that logged-out users do not see the login form, enhancing the user experience.
