From Uncode 2.3.0, it's possible to create custom WooCommerce My Account and Account Forms pages (Login, Register, and Tracking). With the new modules and integrated options, you can create the ultimate shopping experience consistent with the design of your website and your clients’ needs.
My Account
The My Account page is an essential part of every eCommerce website. On this page, the user finds all the real information at his orders. This page is significant for building customer loyalty and completing the shopping experience in the best possible way.
How to set up a custom My Account page
If you need to set up a new My Account page, or want to change what page is used, just follow these steps:
- Create a new page or insert it into a page, the new My Account module of the Page Builder, screenshot .
- Navigate to WooCommerce → Settings → Advanced → My Account page and select from the dropdown your newly created My Account page so that WooCommerce uses this page as My Account, screenshot .
My Account module settings
The My Account module allows you to create many different My Account layouts. Inside this module, you find the options divided into the following tabs:
- General: Here, you find the most important settings to define the My Account layout. In this tab, you find options such as the Main Column Size, Columns Gap, Columns Equal Height.
- Navigation: The Navigation is the My Account module's area with the navigation menu (Dashboard, Orders, Downloads, Addresses, Account Details, and Logout). In this tab, you find options such as Custom Padding, Skin, Background Color, Border Radius, and Shadow.
- Content: The Content is the area of the My Account module with the Dashboard, Orders, Downloads, Addresses, and Account Details contents. In this tab, you find options such as Custom Padding, Skin, Background Color, Border Radius, and Shadow.
- Typography: In this tab, you can define the Typography of the My Account elements (Heading and Text).
- Buttons & Forms: In this tab, you can define Buttons & Forms of the My Account module. You can create a custom Button configuration, set the alignment, and define the Form style.
- Extra: In this tab, it is possible to insert an optional Element ID, and an optional Extra Class Name useful for those who want to modify the module with customs code further.
Account Forms (Login, Register, and Tracking)
The Account Forms are an essential component of any eCommerce site. The Account Forms consist of the Register, the Login, and Tracking Form.
How to set up a custom Register/Login page
If you need to set up a new Register/Login page, or want to change what page is used, just follow these steps:
- Create a new page or insert it into a page, the new Account Forms module of the Page Builder. Generally in the same page are inserted two Account Forms modules, one with Form Type set to Login, screenshot , and one with Form Type set to Register, screenshot .
- Navigate to WooCommerce → Settings → Advanced → Account login and select from the dropdown your newly created Register/Login page so that WooCommerce uses this page as Register/Login page, screenshot .
How to set up a custom Tracking page
If you need to set up a new Tracking page, just follow these steps:
- Create a new page or insert it into a page, the Account Forms module of the Page Builder, and set the Form Type to Tracking, screenshot .
- Optionally, add this page to your Main Menu or Footer links so that users can easily access it.
Account Forms module settings
The Account Forms module allows you to create many different Register/Login layouts. Inside this module, you find the options divided into the following tabs:
- General: In this tab, you find the Form Type dropdown selection, you can set Login, Register, or Tracking.
- Typography: In this tab, you can define the Typography of the Account Forms (Heading and Text).
- Buttons & Forms: In this tab, you can define Buttons & Forms of the Account Forms module. You can create a custom Button configuration, set the alignment, and define the Form style.
- Extra: In this tab, it is possible to insert an optional Element ID, and an optional Extra Class Name useful for those who want to modify the module with customs code further.
Tip. In order to diversify the layout, you can insert the Register/Login modules in two columns, either within a Tabs or within an Accordion module.
Note on using the Frontend Editor
- Forms functionalities are disabled. Please note that modules like the Cart, Checkout, My Account, and Account Forms do not work when using the Frontend Editor. The Frontend Editor is a design tool, forms submitting (necessary, for example, for the operation of the Cart) is disabled in the Frontend Editor mode. Of course, a Cart, a Checkout, a My Account, or an Account Form made through the Frontend Editor work when used by the final user.
- WooCommerce files not included. Some native WooCommerce files are not included if you start working on a blank page directly with the Frontend Editor. These WooCommerce files are only included after Uncode understands that you are using one of the particular modules, or even if you are already on a WooCommerce Cart and Checkout page. So if you have minor problems, please save the page and reload it. This way, all the necessary files will be included while working on the Frontend Editor.
Comments
0 comments
Article is closed for comments.