Displaying and customizing Media Carousel
This article will guide you through the steps to display the Media Carousel by adding it via the app block and customizing this widget quickly in the theme editor.
On this page
- What is a Media Carousel widget?
- Add Media Carousel app block in the theme editor
- Customize the Media Carousel widget
What is a Media Carousel widget?
There are 2 types of Carousel app block
- Review Carousel
- Media Carousel
Media Carousel displays a series of images or videos in a horizontal scrolling format. It allows users to view multiple media items with navigation controls, showcasing product images, videos, and star ratings.
Add Media Carousel app block in the theme editor
Steps
- From the Kudosi dashboard, navigate to the side menu on the left, and click Show Reviews.
- In the Media Carousel section, and click “Install” next to it. This will open a modal and allow you to select the page you want to add the Media Carousel to.
Another way to access the theme editor and add the Media Carousel via the app block in the theme:
- From the Shopify Sales channels, click Online store, click Customize in the current theme section. This will open the theme editor.
- In the theme editor, select one page you want to add the Media Carousel on: Homepage, product page, or collection page.
- On the left sidebar, click Add block > Apps > search “Kudosi” > select Media Carousel.
- You can also drag and drop the Media Carousel widget to the position you want.
Customize Media Carousel in Kudosi
Steps to navigate to Media Carousel customization:
- Navigate to the "Show reviews" section in the dashboard.
- Click “Customize” on the Media Carousel widget.
In the customization, there are 2 main tabs: “Component visibility” and “Style & appearance”.
1. Component visibility
The component visibility settings allow you to show or hide specific components, such as the carousel title and customer name
How to use the component visibility tab
Click on any element in the preview to quickly find it in the configuration panel.
Click the eye icon to toggle visibility for elements. When the eye icon is open, it indicates that the element is visible. When the eye icon is closed, the element is hidden from view.
2. Style & appearance
This is where you can adjust the layout, colors, and shapes to match your store’s branding and functionality.
How to use the style & appearance tab
- Click on any element in the preview to locate its settings in the configuration panel.
- Adjust button actions, sorting preferences, and other display settings in the left panel.
Overall settings
- On click review: Define the action when a review is clicked (e.g., show popup detail, open product link in a new tab, or in the current tab, or none).
- Section background color
- Carousel title color: Change the color for the carousel title.
- Heading text font size: Adjust the font size for the heading text (e.g. review titles).
- Body text font size: Set the font size for the main body of the review text.
- Accessory text font size: Adjust the font size for any additional text elements.
- Spacing from top margin
- Spacing from bottom margin
Review item
- Number of columns on desktop: Set how many review columns are displayed on desktop screens.
- Columns spacing
- Autoplay speed
- Customer name color
Rating icon
This is one of the global settings. If you change it here, the star rating of the Review Carousel will be different from the other widget.
- Rating icon shape: Select the shape of the rating icons (Default, Thin, Rounded, Circle, Heart).
- Rating icon filled color: Set the color for filled rating icons. This setting can change the star color in the Review Carousel.
- Rating icon empty color: Set the color for empty rating icons.
- Rating icon border color: Change the color for the border of rating icons.
- Rating icon size: Adjust the size of the rating icons in pixels.
After adding the Media Carousel and customizing it, remember to click Save to show media reviews in the Carousel in your store.
If you need more help, please feel free to contact us via live chat or email us at support@kudosi.ai
Related articles
Updated on: 08/05/2025
Thank you!