Customizing the star rating icon and color (general)

Key Summary

• Easily customize the Primary color of your Review and Display Widgets to align with your brand identity.
• Access advanced settings to fine-tune colors for specific elements like the star distribution graph and 'Show more / Show less' buttons.
• Understand that these color settings apply broadly to both the Reviews Widget and Display Widgets across your store.
• For Shopify OS 2.0 themes, specific customizations for the star rating widget on product pages are covered in a separate, dedicated guide.

This guide will walk you through the process of customizing the visual appearance and color scheme of your CREMA REVIEW service widgets. By adjusting these settings, you can ensure that your review display seamlessly integrates with your store's branding, enhancing the overall aesthetic and user experience for your customers.

❗ IMPORTANT

• This setting will be applied to Reviews Widget and Display Widgets.
• To customize the star rating widget in the product pages for Shopify OS 2.0 themes, please refer to Customizing Star Rating in the product pages (Shopify 2.0).

STEP 1. Access the Look & Feel Settings

1. Navigate to the Review menu from your CREMA REVIEW admin dashboard.
2. Proceed to the Settings tab.
3. Locate and click on General settings, followed by Look & Feel.

STEP 2. Define Your Primary Color

You can select a Primary color that represents your brand. This color will be prominently used across various elements of your review display, including:

• The main button of Review request pop-ups.
• Buttons within widgets.
• The highlight color of the star distribution graph.
• The main color of the star icon.

STEP 3. Customize Advanced Display Colors

Beyond the primary color, you have the option to fine-tune the colors of several specific elements within the advanced settings. These include:

• The different bars within the star distribution graph.
• The 'Show more / Show less' buttons used to expand or collapse review content.
• The 'Star rating' icon.
• The 'Display by product' icon.

STEP 4. Save Your Customizations

After making all your desired color adjustments, scroll to the bottom of the screen and click the Save button to apply your changes. It's crucial to save your settings to ensure your customized look is published to your live widgets.

Frequently Asked Questions (FAQ)

Do these color settings affect all my CREMA REVIEW widgets?

👉 Yes, the color settings configured in the Look & Feel section are applied to both the Reviews Widget and the Display Widgets across your entire store. This ensures a consistent brand appearance for all your review-related displays.

How do I customize the star rating on product pages specifically for Shopify OS 2.0 themes?

👉 The general Look & Feel settings in this guide do not cover specific star rating customizations for Shopify OS 2.0 themes. For detailed instructions on this, please refer to our dedicated guide: Customizing Star Rating in the product pages (Shopify 2.0).

Is it possible to customize colors for items other than the ones listed here?

👉 Other elements can be modified directly within the CSS scope. For more information, please refer to the Advanced widget customizations using CSS and JavaScript document.