# Testimonials

{% tabs %}
{% tab title="Testimonials: Slider" %}

<figure><img src="/files/mnKyHYjOhFMgkFdWsCt5" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Testimonials: Parallax" %}

<figure><img src="/files/mlzqGcc0Fx9GEgEy2laV" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Testimonials: Carousel" %}

<figure><img src="/files/nr8bTBiS2V2YkxNySIHb" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Testimonials: Grid" %}

<figure><img src="/files/d0j1VKmUfwDpV6LPujMO" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

The **Testimonials** section in the Pebble theme offers **different display styles**, each designed for different types of stores and content volume. All presets let you mix images, review text, ratings, and author info to highlight social proof and build trust.

## How to add a Testimonials section to your Shopify store

{% hint style="success" %}

1. In the theme editor **(Customize)**, click **Add section.**
2. Select **Testimonials** section.
3. Make necessary changes.
4. **Save.**
   {% endhint %}

## How to edit the section Testimonials

### Overview of all layouts (presets)

{% tabs %}
{% tab title="Testimonials: Slider" %}

<figure><img src="/files/dJQeF81pHdtNd66VeFe8" alt="" width="563"><figcaption></figcaption></figure>

A single-review slider with thumbnails as navigation.

{% hint style="success" %}
**Best for:**

* Long-form testimonials
* Hero-style storytelling
* Premium brands wanting an elegant, editorial presentation
  {% endhint %}

**See settings:**&#x20;

[#section-settings](#section-settings "mention")

[#slider-specific-settings](#slider-specific-settings "mention")
{% endtab %}

{% tab title="Testimonials: Parallax" %}

<figure><img src="/files/Z31lxsBHzZE3ni6Ucwqi" alt="" width="563"><figcaption></figcaption></figure>

A visually striking layout with staggered scrolling, creating movement as users scroll.

{% hint style="success" %}
**Best for:**

* Pages with a strong storytelling focus
* Unique and premium layouts
* UGC-heavy reviews with imagery
  {% endhint %}

**See settings:**&#x20;

[#section-settings](#section-settings "mention")
{% endtab %}

{% tab title="Testimonials: Carousel & Grid" %}
A flexible layout that supports both **Carousel** (horizontal sliding) and **Grid** (static) display.

<div><figure><img src="/files/gmRhdWvxNmWILOu5toqk" alt=""><figcaption><p>Testimonials: Carousel</p></figcaption></figure> <figure><img src="/files/1rahe0UwiuvCW068zYrl" alt=""><figcaption><p>Testimonial: Grid</p></figcaption></figure></div>

{% hint style="success" %}
**Best for:**

* Stores with many short reviews
* Quick-scan layouts
* Rapid social-proof sections (4–12 testimonials)

**Carousel strengths:**

* Great for storytelling that moves horizontally
* Saves vertical space

**Grid strengths:**

* Allows many testimonials on one screen
* Best for showcasing volume
  {% endhint %}

**See settings:**&#x20;

[#section-settings](#section-settings "mention")
{% endtab %}
{% endtabs %}

### Section settings

#### **Layout settings**

<table><thead><tr><th width="275">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Type</strong> (Carousel/Grid)</td><td>Available in the <strong>Carousel &#x26; Grid</strong> preset; determines how testimonials are displayed.</td></tr><tr><td><strong>Columns</strong></td><td>Number of columns on desktop (for Carousel &#x26; Grid).</td></tr><tr><td><strong>Column gap</strong></td><td>Horizontal spacing between items.</td></tr><tr><td><strong>Enable swipe on mobile</strong></td><td>Allows touch swiping for carousel-style layouts.</td></tr><tr><td><strong>Mobile columns</strong></td><td>1 or 2 columns on mobile (Grid &#x26; Carousel).</td></tr></tbody></table>

#### **Slider-specific settings**

<table><thead><tr><th width="275">Setting</th><th>Description</th></tr></thead><tbody><tr><td><strong>Autoplay</strong></td><td>Automatically cycles through slides.</td></tr><tr><td><strong>Autoplay delay</strong></td><td>Time (in seconds) before moving to the next slide.</td></tr></tbody></table>

### Block settings

{% tabs %}
{% tab title="Testimonials: Slider" %}
In each **Testimonial** block:&#x20;

* Upload a featured image

<figure><img src="/files/nLwnVglshhokxbyxUTq1" alt="" width="563"><figcaption></figcaption></figure>

* Add review text

<figure><img src="/files/2yTt4kwS2I8RWiPqY9bu" alt="" width="563"><figcaption></figcaption></figure>

* Add author info (name, bio, icon, etc.)

<figure><img src="/files/BCV8lCrFMnU2itliKNFI" alt="" width="563"><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Testimonials: Parallax" %}
The **Testimonials: Parallax** includes a **Section header** and multiple **Testimonial** blocks.

* **Section header** block: [Learn more](/pebble-theme/theme-blocks/storytelling.md#section-header)
* **Testimonial** block: display a featured image (optional), review text and author info in stack style.

<figure><img src="/files/KwJhZcfiRzBUphEhi331" alt="" width="563"><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Testimonials: Carousel & Grid" %}
You can add multiple **Testimonial** blocks to the section.&#x20;

<figure><img src="/files/WWwM6ZylkqfbydaCQUCX" alt="" width="563"><figcaption></figcaption></figure>

*Learn more about the block:*

{% content-ref url="/pages/SKcyC23MvFtaVJVB8K9E" %}
[Testimonials](/pebble-theme/theme-sections/testimonials.md)
{% endcontent-ref %}
{% endtab %}
{% endtabs %}

{% hint style="info" %}

## :bulb: Best practices

* Show an author name or identifier. Examples:

  * Customer Name
  * Verified Buyer
  * Industry expert
  * Editor / Reviewer

  Names drastically increase trust.&#x20;
* Keep spacing consistent. Check:
  * Uniform image sizes
  * Equal padding across sections
    {% endhint %}


---

# 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://docs.foxecom.com/pebble-theme/theme-sections/testimonials.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.