< All Topics
Widget Used
Woo My Account
Demo URL
Click Here
Tutorial Videos
Official Video

If you want to give an authentic look to my (user) account section of your website with the customization and want to use it in the account-related part of your website, we have made a well-designed Woo My Account widget. With the help of this widget, you can customize the account section of your many shopping websites. For example, electronic, real estate, study, etc…
Note: you must have the WooCommerce plugin installed in your WordPress to use this widget feature.

Pro tip
Why not add this widget to your website/product? Because using this widget you can customize your website user account section which will attract your customer, and it will be sufficiently useful in your user account content as well as with the custom style option.

How to use the Woo My Account Widget of The Plus Addons For Elementor

The Woo My Account widget comes with two different types of layout, with the custom styling options you can create a superior-looking my (user) account section for your websites.

General Steps

Search for the Woo My Account element from the Elementor screen in the left and then drag and drop it into the content building area. After dropping the element, you will see three tabs i.e. Content, Style, and Advanced related to the Woo My Account widget. First, click on the Content tab.

1. Content

Woo My Account

1.1: My Account

Select Layout

We have given two layouts (full shortcode and individual) to use to give a different look of content for my account section.

Select Style

We have given two styles (style 1 and style 2) to use to give a different look of content for the full shortcode.

Left Section Width

With this option, you can set the left section width when you have selected a style 2 in the style menu.

Individual Sortable Repeater

We have given five options for an individual layout. Select your desired option for an individual layout. You can set the field where you want to set it, such as top, middle, bottom and you can also add and remove it. The options we provided are:

Dashboard
Orders
Downloads

Addresses
Account Details

Select Tab

With this option, you can set the tab name of the individual layout for my account.

Hide Title

By enabling this option, you can hide the option to set the title.

Maximum Order

With this option, you can set the maximum value of the order when you have selected the orders in the tab menu.

1.2: Extra Options

Update Icons

With this option, you can replace default icons with another font awesome icon using the below options.

Dashboard

With this option, you can set the font awesome icon id of the dashboard.

Order

With this option, you can set the font awesome icon id of the order.

Download

With this option, you can set the font awesome icon id of the download.

Address

With this option, you can set the font awesome icon id of the address.

Account

With this option, you can set the font awesome icon id of the account.

Logout

With this option, you can set the font awesome icon id of the logout.

2.Style

The Style tab is used for customizing the look of all the Woo My Account widget components such as Navigation, Navigation Icon, Content, Dashboard Tab, Order Tab, Download Tab, Addresses Tab, Account Details Tab, Login Form, Lost Password Form, Register Form, Form Box, Error Message, and My Account Background.

Navigation Style

Set Padding, Margin, Background, Border, Border Radius, Box Shadow, and Inner Menu Option (Margin, Padding, Alignment, Typography, Color, Background, Border, Border Radius, Box Shadow) for the Navigation here.

Navigation Icon Style

Set Icon Size, Offset, and Color for the Navigation Icon here.

Content Style

Set Padding, Margin, Background, Border, Border Radius, Box Shadow, and Inner Content Options (Typography, Text Color, Link Color, Hover Link Color) for the Content here.

Dashboard Tab Style

Set Typography, Text Color, Link Color, and Hover Link Color for the Dashboard Tab here.

Order Tab Style

Set Padding, Background, Border, Border Radius, Box Shadow, Inner Border Option (Border), Heading Options (Typography, Text Color), SubText Options (Typography, Text Color), Order Number Options (Typography, Order Number Color, Order Number Hover Color), and View Order Button Option (Padding, Button Width, Typography, Text Alignment, Color, Background, Border, Border Radius, Box Shadow) for the Order Tab here.

Download Tab Style

Set Padding, Background, Border, Border Radius, Box Shadow, Inner Border Option (Border), Heading Options (Typography, Text Color), SubText Options (Typography, Text Color), Product Name Options (Typography, Product Name Color, Product Name Hover Color), and Download File Button Options (Padding, Button Width, Typography, Color, Background, Border, Border Radius, Box Shadow) for the Download Tab here.

Addresses Tab Style

Set Inner Padding, Background, Border, Border Radius, Box Shadow, Heading Options (Typography, Text Color), SubText Options (Typography, Text Color), and Edit Button Options (Padding, Typography, Text Color, Background, Border, Border Radius, Box Shadow) for the Addresses Tab here.

Account Details Tab Style

Set Label Option (Inner Padding, Margin, Typography, Label Color, Required Symbol), Input Field Option (Inner Padding, Margin, Typography, Placeholder Color, Text Color, Background, Border, Border Radius, Box Shadow), Display Name Option (Typography, Heading Color), Field Set Option (Typography, Heading Color, Background, Border), and Button Option (Padding, Button Width, Typography, Color, Background, Border, Border Radius, Box Shadow) for the Account Details Tab here.

Login Form Style

Set Form Heading Option (Typography, Text Color), Label Option (Inner Padding, Margin, Typography, Label Color, Required Symbol), Input Field Option (Inner Padding, Margin, Typography, Placeholder Color, Text Color, Background, Border, Border Radius, Box Shadow), Remember Me Option (Typography, Color), Lost Password Option (Typography, Color, Hover Color), and Login Button Option (Padding, Button Width, Typography, Color, Background, Border, Border Radius, Box Shadow), for the Login Form here.

Lost Password Form Style

Set Heading Option (Typography, Label Color), Label Option (Typography, Label Color), Input Field Option (Inner Padding, Typography, Text Color, Background, Border, Border Radius, Box Shadow), and Reset Password Button Option (Padding, Width, Typography, Color, Background, Border, Border Radius, Box Shadow) for the Lost Password Form here.

Register Form Style

Set Label Option (Inner Padding, Margin, Typography, Label Color, Required Symbol), Input Field Option (Inner Padding, Margin, Typography, Placeholder Color, Text Color, Background, Border, Border Radius, Box Shadow), and Register Button Option (Padding, Button Width, Typography, Color, Background, Border, Border Radius, Box Shadow) for the Register Form here.

Form Box Style

Set Padding, Margin, Background, Border, Border Radius, and Box Shadow for the Form Box here.

Error Message Style

Set Icon Options (Typography, Icon Size, Icon Color, Icon Right Offset), Error Message Text Option (Typography, Color, Link Color, Link Hover Color), and Box Content Option (Padding, Background, Border, Border Radius, Box Shadow) for the Error Message here.

My Account Background Style

Set Padding, Margin, Background, Border, Border Radius, and Box Shadow for the My Account Background here.

Preview

Here you can see with details how the Style option of the Woo My Account Widget works.

3. Advanced

Advanced Tab Options are common across all the widgets. So, we have written a detailed tutorial explaining how to use these options

View The Advanced Tab Tutorial

Do you want to rate this article?
0 out of 5 stars
5 Stars 0%
4 Stars 0%
3 Stars 0%
2 Stars 0%
1 Stars 0%
How can we improve this article?
Need help?