To apply more custom styling to your Reviews Carousel, you can add custom CSS in Judge.me or in Shopify theme editor.
Add custom CSS in Judge.me
To add custom CSS in Judge.me for the Reviews Carousel:
From your Judge.me admin, go to Widgets > Reviews Carousel > Customize.
Scroll down to Advanced and open the Custom CSS (Advanced) editor.
Add in the CSS code from the table below.
Click Save.
What you want to change | CSS code |
To fix product name being cut off in the Reviews Carousel | .jdgm-carousel-item { |
To change the header font size | .jdgm-carousel-title { |
To manually change the star color in the Reviews Carousel | .jdgm-star { |
To change the color of the from | .jdgm-carousel-number-of-reviews { |
To reduce the gap between the Reviews Carousel and the block above it | .jdgm-carousel-wrapper { |
To fix the issue where the Reviews Carousel goes blank when scrolling on RTL (right-to-left) language stores like Arabic. | .jdgm-carousel__item-container { |
Add custom CSS in the Shopify theme editor
For even more customizations, you can add the CSS in Shopify theme editor:
From your Shopify admin, go to Online Store > Themes.
Find the theme you want to edit and click Customize.
On the left menu, click the Theme settings icon
Scroll down to Custom CSS and add the CSS code from the table below.
Click Save.
What you want to change | CSS code |
To change the background color of the Reviews Carousel block in Shopify | div:has(.jdgm-carousel-wrapper) { |
To fix the issue where the stars in the Reviews Carousel are showing weird icons or showing as blocks (typically because our font family for the stars got overwritten by the theme font) | .jdgm-star { |