Changing the order of star rating display on single product page

This topic has 4 replies, 2 voices, and was last updated 2 years, 1 months ago ago by Rose Tyler

  • Avatar: Smithy534
    Smithy534
    Participant
    May 14, 2022 at 18:36

    On my website, in the Xstore theme under my rating tab, the options for rating are displayed in a row and start with a 1-star rating first, then 2-stars, and so on like this: 1 star, 2 stars, 3 stars, 4 stars, 5 stars

    With the 1 star is the first option.

    I look through the code and in woo commerce, the stars options are displayed like this in a column
    5 stars
    4 stars
    3 stars
    2 stars
    1 star

    How do I make the stars display just like the woo commerce option with the 5 stars first?

    What file do I have to edit to have a 5-star rating option first on your rating on the single product page section leave a review like this
    5 stars
    4 stars
    3 stars
    2 stars
    1 star ?

    Please, contact administrator
    for this information.
    3 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 15, 2022 at 08:25

    Hello,

    Add the next code in Theme Options > Theme custom CSS:

    #review_form .stars span {display: flex; flex-direction: row;}
    #review_form .stars .star-1 {order: 5;}
    #review_form .stars .star-2 {order: 4;}
    #review_form .stars .star-3 {order: 3;}
    #review_form .stars .star-4 {order: 2;}
    #review_form .stars .star-5 {order: 1;}

    Regards

    Avatar: Smithy534
    Smithy534
    Participant
    May 16, 2022 at 02:06

    Thank you!

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    May 16, 2022 at 06:49

    You’re welcome!
    We would be grateful for your review if you like our theme https://themeforest.net/item/xstore-responsive-woocommerce-theme/15780546

    Regards

  • Viewing 4 results - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.