How can I adjust the size and position of star ratings in the Product Reviews app?

Store Design
,
1

Hi everyone,

Hopefully someone can help me out. I have installed the Product Reviews app. And added the star rating on my product page on top of the title. Except I would like the stars and the text “No reviews” a bit smaller and little bit higher on top of the title.

https://www.states-gallery.com/products/badshahi-mosque

Screenshot 2023-02-14 at 16.25.19.png
Screenshot 2023-02-14 at 16.25.19.png1034×1100 61.3 KB

1 Like
2

Hi @Haan ,

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/theme.scss->paste below code at the bottom of the file:

.product-single__info-wrapper {
    padding-top: 0 !important;
}
.product-single__info-wrapper .spr-badge {
    margin-bottom: 20px;
}
.product-single__info-wrapper .spr-badge-starrating .spr-icon {
    font-size: 12px;
}
.product-single__info-wrapper .spr-badge-caption {
    font-size: 14px;
    margin-left: 5px;
}

I hope it would help you
Best regards,

Richard | PageFly

1 Like
3

Thank you so much!

1 Like
4

You’re welcome. I’m glad that it can help. :blush: