The My Account page allows customers to view their order history, manage addresses, and edit account details. A well-organized My Account page enhances the customer experience by making account management easy.
Accessing My Account Page
In your WordPress dashboard, navigate to Pages > All Pages.
Find the pre-design my account page and hover over its title.
Click the Edit with Elementor link that appears.
Editing the My Account Page
Open with Elementor: Click on “Edit with Elementor” to start customizing the page.
Add and Customize Widgets: Use Elementor widgets to build your layout. Some useful widgets for the My Account page include:
My Account: This widget displays the customer’s account dashboard.
Order History: Shows the customer’s past orders.
Account Details: Allows customers to edit their account information..
Addresses: Enables customers to manage their billing and shipping addresses.
Design and Style: Customize the appearance of your widgets. Adjust the layout, colors, fonts, and spacing to create an organized and user-friendly account page.
Customizing Each Section:
1. My Account:
Layout: Elementor allows you to customize the layout of the “My Account” section. You can choose a vertical or horizontal tab view to accommodate your design preferences and available space.
Content: While the “My Account” section typically doesn’t display detailed information, you can add elements like a welcome message or a brief overview of the customer’s account status (e.g., recent orders).
Links: Customize the links displayed in this section. You can link them to specific functionalities within the account page or external resources relevant to customer accounts (e.g., returns policy).
2. Order History:
Styling: Customize the appearance of the order history table using Elementor’s styling options. You can adjust fonts, colors, and spacing for improved readability.
Order Details: Define which order details are displayed in the table. Common options include order number, date, status, total amount, and individual product names.
Customization Options (Elementor Pro): With Elementor Pro, you can enable features like:
Order Pagination: Implement pagination for long order lists, allowing customers to navigate through multiple pages.
View Order Details: Allow customers to click on individual orders to see detailed information like product variations, shipping methods, and order notes.
3. Account Details:
Form Customization: Edit the pre-existing form fields for editing account information. You can adjust labels, placeholder text, and required fields for a user-friendly experience.
Password Reset: Ensure a clear and functional password reset link is available within the account details section.
Additional Information: Consider including optional fields for customers to add details like phone numbers or company names (depending on your store’s needs).
4. Addresses:
Separate Billing and Shipping: Maintain separate sections for managing billing and shipping addresses, allowing customers to manage both independently.
Address Editing: Ensure the address editing form functions smoothly and includes essential fields like street address, city, state/province, zip code, and country.
Default Address Selection: Allow customers to choose a default billing and shipping address for streamlined checkout processes.
Preview and Save: Preview your design to ensure it looks good and is easy to navigate. Click “Update” to save your changes.
Additional Tips:
Mobile Responsiveness: Test your customized My Account page across various devices (desktop, mobile, tablet) to ensure proper formatting and functionality.
Clear Labels and Instructions: Use clear labels and concise instructions within forms and sections to guide customers through managing their accounts.
Consider Branding: Maintain consistency with your store’s overall design by using appropriate fonts, colors, and styles within the My Account widget.
Additional Resources
To learn more about Elementor Woocomerce My Account Widget , refer to the following resources:
