How to Show WooCommerce Star Ratings in Elementor
The Product Rating widget allows you to display WooCommerce product ratings inside Elementor product templates. This widget is used when creating custom WooCommerce single product page layouts with Elementor.
The widget pulls the rating data from WooCommerce product reviews and displays star ratings dynamically inside the product layout. You can customize the rating style, icon color, and alignment using Elementor style controls.
This widget is commonly used when designing WooCommerce product templates with Elementor Theme Builder.
Part of WooCommerce Elementor Widgets #
The Product Rating widget is part of the WooCommerce widget collection included with Spexo Addons. These widgets allow you to design complete WooCommerce product templates directly inside Elementor.
You can explore the full widget collection in the WooCommerce Widget Library.
When to Use the Product Rating Widget #
The Product Rating widget is used when you want to display product review ratings on a WooCommerce product page.
This widget is usually placed near the product title or price area. It works well with widgets that Show the WooCommerce Product Name and Display the Product Price.
Requirements #
Before using the Product Rating widget make sure the required plugins and product review settings are available.
- WooCommerce plugin installed and activated
- Products created in your WooCommerce store
- Product reviews enabled in WooCommerce settings
- Elementor product template created
- Spexo Addons plugin installed and active
This widget only works inside WooCommerce single product templates created using Elementor Theme Builder.
How to Add the Product Rating Widget #
Follow these steps to add the Product Rating widget inside an Elementor WooCommerce template.
- Open the WooCommerce single product template in Elementor.
- Search for the Product Rating widget in the Elementor widget panel.
- Drag the widget into your product page layout.
- The widget will automatically display WooCommerce product ratings.
After adding the widget the WooCommerce product rating will appear inside your product layout.
Style Settings #
To customize the Product Rating widget design open the Style tab in the Elementor panel.
Style #
From this section you can control rating icon color, empty icon color, alignment, and size.
These options allow you to match the product rating design with the rest of your WooCommerce product layout.
Common Issues and Fixes #
If the product rating does not appear in Elementor confirm that you are editing a WooCommerce single product template. This widget will not display product ratings on normal pages.
If ratings are not visible check that product reviews are enabled in WooCommerce and that the product has received reviews.
If the widget does not appear in Elementor review the Widget Setup Guide and confirm that the widget is enabled.
Frequently Asked Questions #
Why is the product rating not showing? #
The Product Rating widget only displays ratings when product reviews are enabled and reviews exist for the product.
Can I change the rating star colors? #
Yes. You can customize rating icon color and empty icon color using the Style tab in Elementor.
Does this widget display review comments? #
No. The Product Rating widget only displays star ratings. Review comments appear in product review sections or product tabs.
Getting stuck? Feel free to Contact Our Support for further assistance.
Navigation:
