How to Show Live Stock Status on WooCommerce Product Pages
The Product Stock widget allows you to display WooCommerce product stock availability inside Elementor product templates. This widget helps customers quickly see whether a product is in stock, out of stock, or available for backorder.
The widget pulls stock information dynamically from WooCommerce and displays the stock status inside the product layout. You can customize colors, typography, and alignment using Elementor style settings.
This widget is commonly used when designing WooCommerce product templates with Elementor Theme Builder.
Part of WooCommerce Elementor Widgets #
The Product Stock widget is part of the WooCommerce widget collection included with Spexo Addons. These widgets help you build complete WooCommerce product templates directly inside Elementor.
You can browse the full widget collection in the WooCommerce Elementor Widget Collection.
When to Use the Product Stock Widget #
The Product Stock widget is used when you want to show product availability on a WooCommerce single product page.
This widget is usually placed near the product price or add to cart section. It works well with widgets that Display Product Ratings and Show Product Metadata.
Requirements #
Before using the Product Stock widget make sure the required plugins and product inventory settings are available.
- WooCommerce plugin installed and activated
- Products created in your WooCommerce store
- Stock management enabled in WooCommerce settings
- Product stock quantity configured
- Elementor product template created
- Spexo Addons plugin installed and active
This widget works inside Elementor WooCommerce single product templates.
How to Add the Product Stock Widget #
Follow these steps to add the Product Stock widget inside an Elementor WooCommerce template.
- Open the WooCommerce single product template in Elementor.
- Search for the Product Stock widget in the Elementor widget panel.
- Drag the widget into your product page layout.
- The widget will automatically display the WooCommerce stock status.
After adding the widget the product availability status will appear inside the WooCommerce product layout.
Style Settings #
To customize the Product Stock widget design open the Style tab in the Elementor panel.
Style #
From this section you can change text color, typography, and alignment for the stock status message.
You can also style different stock states such as in stock, out of stock, and backorder to match the design of your WooCommerce product page.
Common Issues and Fixes #
If the product stock status does not appear in Elementor confirm that you are editing a WooCommerce single product template. This widget will not display product data on normal pages.
If the stock message is not visible check that stock management is enabled and product inventory is configured in WooCommerce.
If the widget does not appear in Elementor review the Widget Configuration Guide and confirm that the widget is enabled.
Frequently Asked Questions #
Why is the stock status not visible? #
The Product Stock widget only works inside WooCommerce single product templates. It will not display product data on regular pages.
What stock statuses can be displayed? #
The widget can display in stock, out of stock, or backorder messages depending on WooCommerce inventory settings.
Can I customize the stock message design? #
Yes. You can change text color, typography, and alignment using the Style tab in Elementor.
Getting stuck? Feel free to Contact Our Support for further assistance.
Navigation:
