--- title: "Adding the Reviews Carousel 3.0" slug: "configuring-and-installing-the-reviews-carousel" tags: ["WooCommerce", "Shopify", "Shopify Plus", "Adobe Commerce (Magento)", "Reviews ", "BigCommerce"] updated: 2025-11-19T13:19:18Z published: 2025-11-19T13:19:18Z canonical: "support.yotpo.com/configuring-and-installing-the-reviews-carousel" --- > ## Documentation Index > Fetch the complete documentation index at: https://support.yotpo.com/llms.txt > Use this file to discover all available pages before exploring further. # Configuring and Installing the Reviews Carousel Products Reviews ###### Supported plans Starter, Pro, Premium, Enterprise ###### eCommerce Platform Shopify, Shopify Plus, Adobe Commerce (Magento), BigCommerce, WooCommerce, Salesforce Commerce Cloud, Custom ## Goals and Outcomes The Reviews Carousel increases the visibility of your reviews by letting you feature them at key conversion points across your site. It provides a customizable way to highlight customer feedback throughout the buyer journey, such as on your homepage, product pages, cart, checkout, blog, or landing pages. In this article, you will learn how to configure the Reviews Carousel and add it to your store. ## Feature Overview The Reviews Carousel can be added to any page on your site and configured to show product reviews, site reviews, or both. It automatically selects and displays your most relevant reviews using built-in sorting logic. ## Feature Process To begin customizing or adding the Reviews Carousel, access it in your Yotpo admin under On-Site Widgets. ### Sorting Reviews Automatically The Reviews Carousel auto-sorting logic leverages a data-driven mechanism to showcase your best and most relevant reviews. Reviews displayed according to this logic must meet the following criteria: #### **Product Reviews** - Only displays published reviews - The star rating must be 5 stars - The [review sentiment](https://yotpo.document360.io/docs/smart-sentiment-analysis) must be positive - The review must be longer than 60 characters - Product reviews must include a product image - **On** a product page: displays the most recent reviews for that product. - **Off** a product page: displays the most recent reviews from the most reviewed products.. **Site Reviews** - Only displays published reviews - The star rating must be 5 stars - The [review sentiment](https://support.yotpo.com/en/article/smart-sentiment-analysis) must be positive - The review must be longer than 60 characters - The sorting logic displays the most recent site reviews - If the widget is set to site reviews and placed on a product page, it will show your site reviews **Site & Product Reviews** - Only displays published reviews - The star rating must be 5 stars - The review must be longer than 20 characters - Reviews are sorted in an alternating fashion where the first review displayed is a product review followed by a site review followed by a product review etc - Most recent reviews are displayed first Once you've added this snippet to your product page template, the Reviews Carousel will automatically associate the product reviews relevant to each product and showcase them in the carousel. ### Limitations - The Reviews Carousel requires a minimum of 3 reviews to display and can show a maximum of 12 reviews - The review must be longer than 60 characters to display in the carousel - The Reviews Carousel will not display grouped reviews. To learn more, see [Grouping Products](https://support.yotpo.com/docs/grouping-products). - The Reviews Carousel will not display syndicated reviews. To learn more, see [About Syndication](https://support.yotpo.com/docs/about-syndication). - The Reviews Carousel will not display blocklisted products. To learn more, see [Adding Products to Your Blocklist](https://support.yotpo.com/docs/adding-products-to-blocklist). - If the widget is set to product reviews and placed on a product page, the carousel will only show reviews associated with this product - If the widget is set to product reviews but there aren’t enough eligible reviews, the widget will not appear on-site. ### Customizing the Reviews Carousel #### Accessing the Widget 1. Log into your **Yotpo Admin**. 2. In the left-side menu, go to [**On-Site Widgets**](https://reviews.yotpo.com/#/display-reviews/on-site-widgets). 3. Select **Reviews Carousel** and click **Edit**. 4. **Customize the widget** to your preference. 5. Once done, click **Save changes** in the upper right corner. #### General Settings Customize the slider action, speed, colors, and fonts. - Primary color - applies to the heading. - Primary font - applies to the widget headline, user name, and review headline. - Secondary font - applies to the review content, product name, date, Verified Buyer, and number of reviews. You can also use the CSS editor to add custom styling. #### Widget header Configure whether to show the header, edit the header text, and set optional header links, such as linking to your [SEO page](https://support.yotpo.com/docs/seo-page). #### Reviews Customize how reviews appear in the carousel, including: - Number of reviews - Type of reviews (product, site, or both) ### Adding the carousel to your site After finalizing your customizations: 1. Click **Publish** (top right). 2. Copy the **generated code**. 3. **Paste** the code into the desired location on your site (homepage, product page, checkout page, etc.). > [!NOTE] > **Tip** > > Some eCommerce platforms limit template editing. For best results, place the Reviews Carousel above the fold on homepages or product pages. ### Platform-Specific Installation ****Shopify**** > [!CAUTION] > **Note** > > This guide references commonly used Shopify theme files. If you cannot locate these files, try exploring other template sections or contact Yotpo Support. **Adding the Carousel to Your Homepage** 1. Go to your [Shopify Themes menu](https://www.shopify.com/admin/themes). 2. Click **Actions** > **Settings** > **Edit Code**. 3. Under **Templates**, locate the **index.liquid** or **theme-template.liquid fil**e. Paste the Carousel code. 4. Click **OK** to save the code. **Adding the Carousel to Product Pages** 1. Go to your [Shopify Themes menu](https://www.shopify.com/admin/themes). 2. Click **Actions** > **Settings** > **Edit Code**. 3. Locate the file that you use for your product pages. This is usually called **product.liquid**, **product-template.liquid**, or **main-product.liquid**. 4. Paste the widget code into the file. 5. Click **Save**. ****BigCommerce - Stencil**** **Adding the Carousel to Your Homepage** 1. In your BigCommerce admin go to **Storefront** > **My Themes**. 2. Click **Advanced** and choose **Edit Theme Files**. 3. In the **Theme Files** navigate to **Templates** > **pages** > **home.html** 4. Paste the code in the home.html file **above** the following lines: `{{/partial}}` `{{> layout/base}} ` 5. Click the **Save & apply file** button. **Adding the Carousel to Product Pages** > [!CAUTION] > **Note** > > Some themes require making a copy before editing. Creating a backup is recommended. 1. In your BigCommerce admin go to **Storefront** > **My Themes**. 2. Click on **Advanced** > **Make a Copy**. 3. Once the theme is copied, click on **Edit Theme Files**. 4. Click **Templates** > **Components** > **Products** > **product-view.htm**l or **product.html** and paste the copied code. 5. Click **Save File**. ****Adobe Commerce (Magento)**** > [!CAUTION] > **Note** > > File names and locations may vary by theme. If unsure, enable Template Path Hints. You can read how to do so [here](https://docs.magento.com/m1/ce/user_guide/configuration/advanced/developer.html) (for a more thorough explanation, please click [here](https://support.magerewards.com/article/1534-how-do-i-turn-on-template-path-hints)). **Adding the Carousel to Your Homepage** 1. On your server, open `grid.phtml`. 2. Navigate to: `vendor/magento/module-catalog-widget/view/frontend/templates/product/widget/content` 3. Locate: `<div class="block widget block-products-list <... </div>` 4. Paste the generated code right above these lines of code as shown in the screenshot below: ![](https://cdn.document360.io/f3c2ab59-fe4c-4f93-9614-2872f40e8aa7/Images/Documentation/image-1684764919766.png?sv=2026-02-06&spr=https&st=2026-10-31T17%3A26%3A05Z&se=2026-10-31T18%3A26%3A05Z&sr=c&sp=r&sig=tBpwJ1pEKxzuw5qTdtr8WWbNVcIJsv4YnaKMIpPrgJQ%3D) 5. Save the file. ****WooCommerce**** > [!CAUTION] > **Note** > > This example uses the default WooCommerce Storefront theme. Other themes may require different placement or custom code. **Adding the Carousel to Your Theme** 1. In the main WordPress backend, go to **Appearance** > **Customize**. 2. Select the **Customize** option on your current theme. 3. Choose the section of the page where you'd like the carousel to appear - the Footer, Sidebar, etc. 4. Paste the code and save the changes. ## Related - [Legacy Widgets](/widgets-30.md)