How to Add Star Ratings in WooCommerce Products

According to Oberlo, 6 out of 10 customers are interested in products and are willing to research them, if it has five-star reviews. 

Therefore, to make a good impression and to show credibility, you should add star ratings to products on your store and make sure products get high ratings and reviews 

As a first step, to help you out in adding star ratings, here are 2 ways on How to Add Star Ratings in WooCommerce Products. 

How to Add Star Ratings in WooCommerce Products

Below are two methods that we have explained step by step so you can quickly get started. 

• Method 1: By Default Settings
• Method 2: By Coding 

Now let’s explore each of the above methods on adding star ratings.

Method 1: By Default Settings

• Go to “WooCommerce” then “Settings”
• Then click “Products”
• Tick mark the “Enable star rating on reviews” option 
• Save changes

After these steps, your products will show star ratings if they get one or more stars.

Method 2: By Coding 

If you want to customize the way star ratings appear for products or want to show star ratings, even when a product has not received any, then you can follow this method. Paste the code mentioned below, in your active/child theme’s function.php file. 

add_action('woocommerce_after_shop_loop_item', 'get_star_rating' );
$product = wc_get_product( $product_id );
 
 

$average_rating = $product->get_average_rating();
 $width = ( $average_rating / 5 ) * 100 ;
 		

    echo '<div class="star-rating"><span style="width:'.( $width ) . '%"><strong itemprop="ratingvalue" class="rating">'.$average_rating.'</strong> '.__( 'out of 5', 'woocommerce' ).'</span></div>';

Another way you can do it is by using this code. 

$product = wc_get_product( $product_id );

echo wp_kses_post( wc_get_rating_html( $product->get_average_rating() ) );

Conclusion

So there you have it. Two methods to add star ratings to WooCommerce products. You can either opt for the direct and simple method or the programming one which is also fairly straightforward. 

Simply paste the code and get started. For more informative WooCommerce-related articles check out the site.