WooCommerce Elements
Spexo Addons provides a collection of Elementor WooCommerce widgets designed to extend the functionality of your WooCommerce store. By this guide you will know how to utilize and set up several WooCommerce widgets that will enhance your Elementor based online store. These elements allow you to customize your product pages, shopping cart, check out, and many more to ensure a better shopping experience.
WooCommerce Elements in Spexo Addons help you build custom eCommerce layouts inside Elementor. These widgets allow you to design product grids, cart pages, checkout sections, and account layouts.
What WooCommerce Elements Include
This section covers widgets for product display, filtering, cart components, wishlist features, and checkout layouts. Each widget controls a specific part of the WooCommerce flow. For consistent styling across your store, review the Global Options documentation. This helps maintain unified design rules across pages.
Requirements Before Using WooCommerce Widgets
WooCommerce must be installed and active on your WordPress site. Elementor should be updated to a stable version. Your theme must support standard WooCommerce templates. Confirm server compatibility to avoid rendering conflicts.
Before you design sale sections, cart notices, or product offer areas, confirm the pricing logic first. Use the discount calculator to check the final discount before updating your WooCommerce layout.
How to Use WooCommerce Elements in Elementor
Open any page with the Elementor editor. Enable required WooCommerce widgets from the Spexo Widget Settings panel. Drag the desired widget into your layout and configure content options. For product grid layouts, refer to the Woo Product Grid documentation for detailed configuration steps.
Performance and Store Layout Control
Enable only the widgets needed for your store. Disabled widgets do not load unnecessary CSS or JavaScript. This approach helps maintain better frontend performance. Always test pagination and filter behavior after making layout changes.
Guides in This Section
The list below includes individual documentation pages for each WooCommerce widget. Each guide explains setup, configuration, and styling options in detail. Follow those guides when building or modifying store layouts. Structured configuration improves long term stability.
- How to Show WooCommerce Products in a Slider or Carousel
- How to Show Dynamic Product Names on WooCommerce Pages
- How to Display WooCommerce Product Images in Elementor
- How to Display WooCommerce Product Pricing in Elementor
- How to Add a Cart Button to WooCommerce Product Pages
- How to Configure WooCommerce Product Tabs in Elementor
- How to Show Short Product Descriptions in Elementor
- How to Display Full Product Descriptions in Elementor
- How to Show WooCommerce Star Ratings in Elementor
- How to Display Product SKU and Categories in Elementor
- How to Show Live Stock Status on WooCommerce Product Pages
- How to Add Product Notices to WooCommerce Pages
- How to Set Up the Product Mini Cart in Elementor
- How to Build a Custom WooCommerce Cart Page in Elementor
- How to Build a Custom WooCommerce Checkout Page in Elementor
- How to Add WooCommerce Product Filters in Elementor
- How to Add WooCommerce Breadcrumbs in Elementor
- How to Build a Custom WooCommerce My Account Page
- How to Display WooCommerce Categories as a Grid in Elementor
- How to Add a Wishlist Button to WooCommerce Products
- How to Add a Mini Wishlist Icon to Your WooCommerce Header
- How to Display the WooCommerce Wishlist Table in Elementor
- How to Add a Compare Button to WooCommerce Product Pages
- How to Add a Mini Compare Icon to Your WooCommerce Header
- How to Build a WooCommerce Product Comparison Table
- How to Display WooCommerce Products in a Classic Grid
- How to Configure the Product Media List Widget in Elementor
- How to Display Product Attributes and Custom Fields