How can I hide rating stars without reviews on my product page?

[entranced]

Hi,

Im trying to hide the rating stars if there is no reviews yet and found this code in the forum and pasted it in the bottom of base.css.

.spr-badge[data-rating=“0.0”] {
visibility: hidden;

display: none;
}

That didnt work.

I also tried with:

.spr-stars[data-rating=“0.0”] {
visibility: hidden;

display: none;
}

and

.spr-starrating[data-rating=“0.0”] {
visibility: hidden;

display: none;

}

but no luck there.

Please advice.

Theme “Be yours” and Shopifys regular “Product Reviews”-app.

url: www.wixter.se

[EcomGraduates]

Hello there

Please try this & this works for both the product page and collection pages.

Just add the following CSS into your main theme CSS file:

.spr-badge[data-rating="0.0"] { display: none; visibility:hidden; }

[entranced]

Thanks for the reply.

I have tried it but it doesn’t work in my case.
.spr-badge does not exist here but the reference seems to be .spr-stars instead.

The code should be something like:

.spr-stars[aria-label="0 out of 5 stars"] {display: none;}

But I cant get it right…

[KetanKumar]

@entranced

oh sorry for that issue can you try this code

1. Go to Online Store->Theme->Edit code
2. Asset->/base.css ->paste below code at the bottom of the file.

.spr-starrating .spr-stars span[aria-label="0 out of 5 stars"] {
    display: none !important;
}

[entranced]

Works like a charm. Thanks a lot!

[Andy106]

Is there a way to hide the text as well??

[KetanKumar]

@Andy106

oh sorry any issue can you please share store ulr and let me know which test hide?

[Andy106]

https://ch8873b2acqq6w6l-68796285242.shopifypreview.com

If aproduct has no reviews, i used your code to hide the stars, but the phrase ‘No reviews’ Still appears. I want to hide the phrase ‘No reviews’ as well.

[KetanKumar]

@Andy106

Thanks for details yes please add this code

1. Go to Online Store->Theme->Edit code
2. Asset->/base.css ->paste below code at the bottom of the file.

.product__info-wrapper .spr-stars {
    display: none !important;
}

[Andy106]

Excellent, works great ! Thanks

[nishant08]

Hello @KetanKumar I wanted to hide the review stars from the products which have 0 reviews, I use the “sense” theme of shopify, when i used the above code, the stars were removed from products with 0 reviews but it also removed the stars from products which do have reviews. check the product with 12 reviews in the image below:

Can you help ?

[Andy106]

Hello, @KetanKumar . I have the same issue and I want to hide the stars for no ratings for the featured products. How can i do that?
https://mastorascy.myshopify.com/products/strongseal-tape-waterproof