change review start icons on Woo product page

Home › Forums › Jevelin Theme › change review start icons on Woo product page

Home › Forums › Jevelin Theme › change review start icons on Woo product page

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    RESOLVED Posts

  • theathleteblog
    Participant

    Hi there,

    I recently noticed that review stars on my product pages are not filled, which makes them appear as if there’s either no rating or the rating is low.

    Here’s  a product page for example – https://theathleteblog.com/product/train-for-adventure-4-steps-to-lasting-performance/

     

    Is it possible to change the star icon to a filled star? Like I added in the testimonial section of this page – https://theathleteblog.com/running-triathlon-coaching/

     

    I attached a snapshot of what I’m thinking

     

    Thanks and all the best,

    Andrejs

     

    Attachments:
    You must be logged in to view attached files.

    Shufflehound
    Moderator

    Hi there,

     

    It might be possible to change it via custom CSS code, you can try this one:

    .sh-recent-products .woocommerce .star-rating:before,
.sh-recent-products .woocommerce .star-rating span:before,
.woocommerce .woocomerce-styling .star-rating:before,
.woocommerce .woocomerce-styling .star-rating span:before {
    font-family: "star"!important;
    content: "SSSSS"!important;
}

     

    Let us know if that works! 🙂

     

    Best regards,

    Shufflehound team

    theathleteblog
    Participant

    Thanks, that worked!

    Quick follow up question – I see in the content: part there is SSSSS added – will it work also for other amount of stars (i.e. 4 stars or 3 stars)? Or will this always produce 5 stars?

    Shufflehound
    Moderator

    That is great! 🙂

    It should work for any amount of stars, but we recommend testing it.

    theathleteblog
    Participant

    I tested it with 4 stars and unfortunately it showed 5 stars instead 🙁

    Shufflehound
    Moderator

    It seems that it is due to the custom orange color that you added there (via CSS).

    Can you please try to remove it?

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)