Product Tabs
How to Use Product Tabs #
Product Tabs Widget in Elementor is a user interface element commonly used in e-commerce websites to display concise information about a product. It typically consists of tabs representing different categories of information related to the product, such as description, specifications, reviews, and shipping details.
How to Activate Product Tabs Elementor #
To use this Sastra Addons element, find the ‘Product Tabs‘ element from the Search option under the ‘ELEMENTS‘ tab. Simply just Drag & Drop the ‘Product Tabs’ into the ‘Drag widget here‘ or the ‘+’ section.
After you are successfully done with this step, this is how the element is going to look like.
How to Style Product Tabs #
To customize Product Tabs, click on the ‘Style’ tab, and you will find many different options here.
Tab Labels #
From here, you can change lable color, background color, border color and typography with normal, hovered and active options. Than you can change transition duration, padding and margin.
Moreover, you can styling to border and border radius as well.
Tabs Content #
From here, you can change content color, background color, border color, typography and padding. Than you can use toggle for enable/disable show title. If show title option is enable than you can set title color, typography and distance.
Besides, you can styling to border and border radius as well.
Additional Information #
This section divided in two sub-sections : Attribute Name and Attribute Value. In Attribute Name sub-section, you can change attribute name color, background color, even background color, typography, alignment and width.
In Attribute Value sub-section, you can change attribute value color, background color, even background color and typography.
Besides, you can change padding, divider color, divider width and you can use toggle for enable/disable show table border as well.
Review Comments #
From this section, you can set author color, date color, rating color, rating unmarked color, description color, background color, border color and padding. Than you can use slider bar for change vertical gutter, rating icon size, avatar image size and avatar distance.
Moreover, you can styling to border and border radius as well.
Review Forms #
This section divided in two sub-sections : Labels and Rating. In Attribute Name sub-section, you can change label color, required color, typography and bottom distance.
In Rating sub-section, you can change rating icon color, icon size and icon gutter.
Besides, you can change text color, background color, border color and box shadow with focus and normal options. You can use slider bar for input height, textarea height and vertical gutter with all supported devices. Also you can styling to border and border radius as well.
Submit Button #
From this section, you can set color, background color, border color and box shadow with hovered and normal options. You can change alignment, typography, transition duration, padding and top distance.
Moreover, you can styling to border and border radius as well.
Final Outcome #
By following the basic steps and a bit more modifying, you can style your Product Tabs as per your preference.
Getting stuck? Feel to Contact Our Support for further assistance.
