The Woo Commerce widget is used to showcase your products on your website. You just need to add the image, name, and price of the product, and you’re done. Our Element’s options give full justice to all needs related to it.
You can create amazing testimonials layouts with lots of listing, customization, and styling options using this widget for WordPress using Elementor.
How to use the Woo Commerce Widget of The Plus Addons For Elementor
The Woo Commerce widget comes with different styles and a plethora of customization options using which you can create stylish looking players for your websites.
Search for the Woo Commerce 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 Commerce widget. First, click on the Content tab.
Product Listing Types
Select Product Listing Type for the Woo products. You will three options to choose from here:
Single Page Related Products
Select your preferred Style for the Woo products. You will get three styles to choose from the dropdown.
Select your preferred Layout for the Woo products. You will get four layout options here.
Select Category for the Woo Products here.
if you want to include multiple products so use comma as separator. Such as abc , xyz.
if you want to exclude multiple products so use comma as separator. Such as abc , xyz.
Maximum Posts Display
Select how many posts you want to display Maximum.
Hide posts from the beginning of the listing.
Select in what order by which the Client logos will be displayed.
Select the order type of the Team member listing either ascending or descending.
Select which products you want to be displayed on the front end.
Set your the column you want to display on desktop devices.
Set your the column you want to display on Tablet devices.
Set your the column you want to display on Mobile devices.
Columns Gap/Space Between
Set how much gap will be there in between the Columns.
Set a the Title Tag that you want to be used for your products.
Variable Product Price Range
Enable the Variable Product Price Range option here.
On Hover Image Change
Enable the On Hover Image Change option here.
Enable the Display Category option here.
Enable the Display Rating option here.
Cart Button Display
Enable and set the Cart Button Display option here.
Add to Cart Text
Enter the Add to cart text here.
Select Options Text
Enter the Select Options Text here.
Display YITH Buttons
Enable and set the Display YITH Buttons options here.
Compare – Slide to enable Compare.
Wishlist – Slide to enable Wishlist.
Quick View – Slide to enable Quick view.
Display Image Size
Enable and set the Display Image Size options here.
Set the Image Size here.
Category Wise Filter
Enable and set the Category Wise Filter here.
All Filter Category Text
Enter the All Filter Category text here.
Category Filter Style
Set the Category Filter style here.
Filter Hover Style
Set the Filter Hover style here.
Set the Filter Alignment here.
More Post Loading Options
Select the More Post Loading Options for Woo products.
The Style tab is used for customizing the look of all the Client logos widget components such as Song Title, Song Author, Split Text, Control, Tracker, Playlist, and Player Background.
Set the typography and content color for the product title.
Set the margin, price typography, Price Color, Price Typography and previous price color.
Enable and set the Badge style options here.
Set the Alignment, Padding, Background type, and box shadow options here.
Set the border radius, Background type, and box-shadow options here.
Add to Cart Button
Set the padding, typography, text color, box border, Background type, and box-shadow options here.
Box Loop Background Style
Set the padding, Box border, background type and box shadow for the Woo products.
Post Not Found Options
Set the Margin, padding, typography, color, box border, Background type, and box-shadow options here.
Enable and set the Messy Columns options here.
On Scroll View Animation
On Scroll View Animation Options are used to set beautiful animations to your sections. They are a common option for almost all the widgets. So, we have written a detailed tutorial explaining how to use these options.
View On Scroll View Animation Tutorial