# Review carousel

### **1. Enable Review carousel**

Head to "**Display reviews**" section on the left side menu. Locate the "**Review carousel**" feature and click "**Setup**".

<figure><img src="/files/WfzS4FyRXB8Agw5JyI7V" alt=""><figcaption></figcaption></figure>

Make sure to toggle the switch in the page header (next to the **Review carousel** title) to enable the widget.

<figure><img src="/files/8vHlBuYuOZtOuW1PoWj7" alt=""><figcaption></figcaption></figure>

### **2. Positioning the Carousel**

You can place the carousel using either the theme editor or a snippet of code.

#### **2.1 Method #1: Select position (theme editor)**

**Step 1** — Click "**Theme settings**" to open the Shopify theme editor.

<figure><img src="/files/VekwO6s23sHyfX8cwlLl" alt=""><figcaption></figcaption></figure>

**Step 2** — Select the page where you want the carousel to appear (e.g. Home page, Collection page, Product page).

<figure><img src="/files/mScEITVrYblEN41JHasm" alt=""><figcaption></figcaption></figure>

**Step 3** — At the position you want, choose **Add block > Apps > Review Carousel Widget**.

<figure><img src="/files/fsXU1JXnX8n3krKh8ajo" alt=""><figcaption></figcaption></figure>

**Step 4** — Click **Save** to apply the changes.

#### **2.2 Method #2: Snippet code**

Use this if you want the carousel in a custom location your theme blocks can't reach.

**Copy the snippet from the app:**

```html
<div class="AirReviews-Widget AirReviews-Widget--Carousel"></div>
```

<figure><img src="/files/k6BjvvCwBU9IImJoqv3h" alt=""><figcaption></figcaption></figure>

Go to "**Online Store**" → "**Themes**" → click "**Actions**" → "**Edit code**".

<figure><img src="/files/zo5k1CcLwOMNCSEf1un3" alt=""><figcaption></figcaption></figure>

Paste the snippet into the target template at the position you want.

<figure><img src="/files/qLRRRigUIK65DlegFAh9" alt=""><figcaption></figcaption></figure>

**Save** the file and view the carousel on your storefront.

### **3. Customize Carousel Widget**

#### **3.1 Heading text color**

Pick the color for the carousel widget's heading.

<figure><img src="/files/0f82Nn1mN1xnvMtYp6mx" alt=""><figcaption></figcaption></figure>

#### **3.2 Display**

Toggle these checkboxes to control what the carousel shows:

**Hide carousel Images** — exclude the photos attached to each review.

<figure><img src="/files/ngsvcPWXD10uxPvhdLge" alt=""><figcaption></figcaption></figure>

**Hide footer section** — remove the footer area from the widget.

<figure><img src="/files/ZZAbHHCcyltjJGmpDMId" alt=""><figcaption></figcaption></figure>

**Show navigation button on mobile** — show the previous/next arrows on mobile devices.

<figure><img src="/files/w8oUjs7Gb68k6YX3jWyD" alt=""><figcaption></figcaption></figure>

**Auto play** — automatically advance to the next review on a timer.

**Show featured reviews only** — display only reviews you have marked as **Featured**.

**Show product reviews only** — when the carousel is placed on a product page, only show reviews of the current product instead of pulling from the whole store.

### **4. Advanced settings**

Open **Advanced settings** at the bottom of the page to fine-tune the look beyond the heading color.

* **Custom CSS** — paste your own CSS to style the carousel beyond what the built-in fields offer. Best for merchants comfortable with CSS. Example:

```css
.AirReviews-Carousel__Header {
  color: #FFFFFF !important;
}
```

***

*This guide ensures you can efficiently implement and customize the Review Carousel to significantly enhance your Shopify store's user experience.*


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.airreviews.io/display-reviews/review-carousel.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
