Add star rating from a product ID on some pages in Woocommerce

Question

Is there a way to call to the star rating of a specific product on a custom page, at custom locations? In other words, can I add a star rating of a specific tshirt to appear under a picture of the tshirt on my homepage, for example?

I imagine I need to add some sort of php to my editor and then call it by some sort of html. I saw this answered thread, in which, one of the answers seems to have helped people, however, it only gives you the necessary php, so I don't know how to actually put that on a specific spot on a specific page. I'm also not sure if that answer addresses the possibility of adding the stars on custom pages, and not just woocommerce pages.

Another one of the answers on that thread contains html. I tried it out and I was able to load the stars, except that they don't correspond with the actual star rating on the product page.

I apologize about the fact that similar questions already exist, however, they don't seem to address my needs directly and I'm too incompetent to make them work :/.

LoicTheAztec LoicTheAztec · Accepted Answer · 2018-09-01T00:09:36

For a specific product ID you can use some dedicated WC_Product methods:

// Get an instance of the WC_Product Object (from a product ID)
$product = wc_get_product( $product_id);

// The product rating count (number of reviews by rating )
$rating_count = $product->get_rating_counts(); // Multidimensional array

// The product average rating (or how many stars this product has)
$average_rating = $product->get_average_rating();

// Testing Output
echo '<p>Rating average: '.$average_rating.' stars</p>';

To display the product "stars" average rating:

You can use the dedicated function wc_get_rating_html() with get_average_rating() WC_Product method. So the necessary code will be:

// Get an instance of the WC_Product Object (from a product ID)
$product = wc_get_product( $product_id);

// The product average rating (or how many stars this product has)
$average_rating = $product->get_average_rating();

// The product stars average rating html formatted.
$average_rating_html = wc_get_rating_html($average_rating);

// Display stars average rating html
echo $average_rating_html;

Tested and works.

An interesting answer: Rating is showing numbers instead of stars

A shortcode to display a product star rating everywhere - 2 code versions:

1) The best way based on wc_get_rating_html() function (for Woocommerce 3+):

add_shortcode( 'product_rating', 'display_the_product_rating' );
function display_the_product_rating( $atts ) {
    // Shortcode attributes
    $atts = shortcode_atts( array(
        'id' => '',
    ), $atts, 'product_rating' );

    if ( isset($atts['id']) && $atts['id'] > 0 ):

    // Get an instance of the WC_Product Object
    $product = wc_get_product( $atts['id'] );

    // The product average rating (or how many stars this product has)
    $average = $product->get_average_rating();

    endif;

    if ( isset($average) ) :

    return wc_get_rating_html($average);

    endif;
}

2) The old way (also works):

add_shortcode( 'product_rating', 'display_the_product_rating' );
function display_the_product_rating( $atts ) {
    // Shortcode attributes
    $atts = shortcode_atts( array(
        'id' => '',
    ), $atts, 'product_rating' );

    if ( isset($atts['id']) && $atts['id'] > 0 ):

    // Get an instance of the WC_Product Object
    $product = wc_get_product( $atts['id'] );

    // The product average rating (or how many stars this product has)
    $average = $product->get_average_rating();

    // HERE the average width
    $average_width = $average * 16 . 'px';

    endif;

    if ( isset($average) ) :

    return '<div class="starwrapper" itemprop="aggregateRating" itemscope itemtype="http://schema.org/AggregateRating">
        <span class="star-rating" title="'.sprintf(__('Rated %s out of 5', 'woocommerce'), $average).'">
            <span style="width:'.$average_width.'">
                <span itemprop="ratingValue" class="rating">'.$average.'</span>
            </span>
        </span>
    </div><br clear="all">';

    endif;
}

Code goes in function.php file of the active child theme (or active theme). Tested and works.

USAGE EXAMPLES:

1) In the WordPress pages or posts text editor (Where 37 is the product ID):

[product_rating id='37']

2) In the php code:

echo do_shortcode( "[product_rating id='37']" );

3) Between html tags:

<?php echo do_shortcode( "[product_rating id='37']" ); ?>

You will get something like:

Add star rating from a product ID on some pages in Woocommerce

1 Answers