[christine-iParticipant]

Hello,

is it possible to place the stars of the woocommerce reviews under the product (on the shop page)?

I´ve tested my shop with the standard wordpress themes like twenty thirteen or WordPress classic. If I use the standard wordpress themes the stars of the reviews are under the products. But if I activate the X theme the stars are on the right top of the product image. That´s not what I want. Could you help me please?

Best regards,
Christine

[ChristianModerator]

Hey Christine,

Please add the code below in your Appearance > Customize > Custom > CSS

.woocommerce li.product .star-rating-container, .woocommerce-page li.product .star-rating-container {
    position: static !important;
    opacity: 1 !important;
}

.woocommerce li.product .entry-header .button, .woocommerce-page li.product .entry-header .button {
    top: -100px !important;
}

Hope that helps. 🙂

[preetgaParticipant]

Hi there, I too would like my stars under my product. This code isn’t displaying coloured stars so you can’t see how many stars have been reviewed for each product.

How do I achieve that please?

Many thanks,
Preet

http://www.naturalhealthstar.com/product-category/skin-care/hands-and-feet/foot-care/

[Rue NelModerator]

Hello There,

Thanks for updating this thread! This is the color of star. Right now in your page you have a rating of 5 out of 5 ratings. If you want to change the color of the star, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.woocommerce .star-rating:before, 
.woocommerce .star-rating span:before {
    color: green !important;
}

Feel free to change the color that would match your site colors. To position it under your product thumbnails, please add the code from our previous reply (https://community.theme.co/forums/topic/place-stars-of-the-woocommerce-reviews-under-the-product/#post-753975).

Thank you.

[preetgaParticipant]

That’s fantastic thank you so much!

Just one last thing please? Changing the the colour of the stars works perfectly but how do I remove the grey background to white please? I’d like brown stars with a white background.

Many thanks,
Preet

[Rue NelModerator]

Hello Preet,

Thanks for the updates! To remove the grey background and change it to white, please add the following css code in the customizer, Appearance > Customize > Custom > CSS

.woocommerce li.product .star-rating-container {
    background-color: transparent !important;
}

If you need anything else we can help you with, please let us know.

[preetgaParticipant]

You’re an absolute legend…thank you!

[ThaiModerator]

You’re very welcome 🙂

If you need anything else, please let us know.

[Author]

Posts