[Resolved] display rating – hide if none

[Webmaster]

How do I “hide” rating if there is no review for a product on Catalog page? I still desire review rating be displayed for products that have a rating though… just hide the ones that do not.

Customizing ▸ Layout ▸ WooCommerce ▸ Display Rating

If working with a few dozen products, I think it looks bad when there are a bunch of empty stars.

Might you know, if this was already asked? I searched but only briefly… didn’t look like like someone asked this already.

Maybe, if it’s not hard either, could add a number of ratings after the stars to the product rating on catalog page.

[David]

Hi there,

try this CSS:

.woocommerce .products .star-rating[title~="Not"] {
    display: none;
}

[Webmaster]

Nice share David!! Brilliant!

🙂

Thanks again!

Might you know how to show # of reviews (excluding “customer review” text) next to the stars on catalog page? That would be a nice touch. I think.

On the single product page, the HTML looks like:

<a href="#reviews" class="woocommerce-review-link" rel="nofollow">(<span class="count">1</span> customer review)</a>

[David]

Do you have a link to a product with some reviews so i can take a look ?

[Webmaster]

Sadly, no, test environment is local. It’s just a standard WordPress site with 1 fake sample review. Let me see if I can find a woocommerce demo website… one second.

Alright here we go! https://themes.woocommerce.com/storefront/product/flying-ninja/

Notice how it say’s “(4 customer reviews)”? How do we loop (4) onto the store page for GP to show after star rating? So gpexample.dev/shop website has a test product with 1 review. Right now, it just has Product name and displays stars, but no (*) after the stars.

Thanks again!

[David]

Try adding this PHP snippet to your site:

add_filter( 'woocommerce_product_get_rating_html', function ( $html, $rating, $count ) {
	global $product;
	if ( $html && is_archive() && $product) {
		$html .= sprintf( '<span class="review-count">(%s)</span>', $product->get_rating_count() );
	}

	return $html;
}, 10, 3 );

And this CSS to place them stars and count inline:

.woocommerce ul.products li.product .star-rating {
    display: inline-block;
}

[perlfan]

Hi – I added the php snippet and CSS to my site, but I don’t see the review count on the catalog page besides the stars (overview of all products). What am I doing wrong?
Frank

[David]

Hi there,

to be honest i am not sure as the OP never responded to that piece of code.
If you want to create a new topic, and share a link to your site with that code added i can take a look. But it may end up being a question for Woocommerce. Happy to take a look though.

[Author]

Posts