Hello ​@EdenF5 

To achieve the desired look for your review carousel, you will need to customize the CSS and possibly modify the HTML structure depending on your current setup. Here’s a professional approach:

1. Background Color for Stars: Use CSS to wrap the stars in a container or apply a background directly. For example:

.review-stars {

    background-color: #f0f0f0; /* Replace with your desired color */

    padding: 5px; /* Adjust for spacing */

    border-radius: 4px; /* Optional for rounded edges */

    display: inline-block; /* Ensure the stars align neatly */

}

2. Verified Badge Positioning: To move the verified badge to the top, modify its position in your HTML structure or use CSS positioning. For example:

.verified-badge {

    position: absolute;

    top: -10px; /* Adjust as needed */

    left: 50%; /* Center horizontally if required */

    transform: translateX(-50%);

}

.review-container {

    position: relative; /* Ensure proper positioning context */

}

3. Responsive Adjustments: Ensure the carousel remains responsive by testing the changes across various devices and screen sizes.

If the implementation feels overwhelming, feel free to reach out, and I’d be happy to assist with setting this

up for your specific carousel.

Hey I messaged you on Whatsapp cheers.

Hey ​@EdenF5!

Just wanted to check and see if you figured this out yet! We have an article on review widget customization that goes over how to customize the Featured reviews carousel.

To accomplish your goal, you’d visit the Layout section of the featured reviews carousel style settings. From there, you’d edit the Card items to display the verification badge.

Next, in the Style section, you’d edit the Filled color and Border in the Rating style settings. 

Let me know if I can answer any additional questions regarding this, and have a great weekend.

-Byrne

Hi ​@EdenF5 

Thank you for posting in the Community!

Have you got this issue solved? :-) 

Christian Nørbjerg Enger
Partner & CPO
Web: Segmento.dk
LinkedIn: @christianfromsegmento
Voldbjergvej 22b, 8240 Risskov

Hello ​@EdenF5,

If you are yet to solve this issue, try these:

1. Use browser tools to examine the HTML and CSS of the desired style.

2. Add CSS to change star background color (e.g., `background-color: gold;`).

   Badge: Use CSS `position` to move the verified badge (e.g., `position: absolute; top: -5px; left: 0;`).

3. If using a library, check for customization options within the component settings.

If you're still stuck, provide more details about your setup for more specific guidance.

Best Regards,

Peace Amos.

+2348110490971