# Testimonials

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

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FCEAU6I8cEnicRpzYEnSv%2FFox-BG%20Light%20-%202025-11-26T143633.745.jpg?alt=media&#x26;token=08828b54-d868-4830-9809-1bbdd50ecab8" alt=""><figcaption></figcaption></figure>
{% endtab %}

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

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FugZSqFUoBO14RTO5704C%2FFox-BG%20Light%20-%202025-11-26T143941.226.jpg?alt=media&#x26;token=ab0f5ee3-1c78-40f2-a30c-de17094e6217" alt=""><figcaption></figcaption></figure>
{% endtab %}

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

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FKR8eGCqJ68IXNOC8AmTO%2FFox-BG%20Light%20-%202025-11-26T144607.385.jpg?alt=media&#x26;token=14731496-5093-45c3-bea1-cbfc3de0bd41" alt=""><figcaption></figcaption></figure>
{% endtab %}

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

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2F9Nbsx6cDUfvxRPZB3Ziz%2FFox-BG%20Light%20-%202025-11-26T144944.096.jpg?alt=media&#x26;token=fa681b13-845f-4d99-967a-2a2cfeff4d01" 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="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2F0zUFuC8MpnkW2uQ1jCVq%2Fimage.png?alt=media&#x26;token=53c7704f-6c46-4288-9e7e-11742d817928" 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="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FCwNOp2iN60IDE0rRf8Aw%2Fscrollingcards.gif?alt=media&#x26;token=4aa5c893-a428-4507-a25f-28a1111e5687" 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="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FW2z0RHUpWCC3cMsD8NAJ%2Fimage.png?alt=media&#x26;token=c984c363-00f5-4ad1-9f75-ac34dc47d088" alt=""><figcaption><p>Testimonials: Carousel</p></figcaption></figure> <figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FM7PyufNB07Sd4CEWwtRW%2Fimage.png?alt=media&#x26;token=897e6883-ceb2-4685-91aa-1f69f0c11734" 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="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FrLyEFSIRddkfVPHgNF3C%2Fimage.png?alt=media&#x26;token=ef68e33d-ea3f-4b21-ae72-4d05713145d0" alt="" width="563"><figcaption></figcaption></figure>

* Add review text

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FucLB3ukgQdMfl5IrbLhR%2Fimage.png?alt=media&#x26;token=035b3491-e2dc-46a5-ad58-5def00954d7d" alt="" width="563"><figcaption></figcaption></figure>

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

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FQGEqJv9Fs6y5bIryIZV9%2Fimage.png?alt=media&#x26;token=ebaa9a19-929e-4381-aae2-314f3896da67" 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](https://docs.foxecom.com/pebble-theme/theme-blocks/storytelling#section-header)
* **Testimonial** block: display a featured image (optional), review text and author info in stack style.

<figure><img src="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2Fm1TZwBp7cy5dLLeQpUjM%2Fimage.png?alt=media&#x26;token=7b0ff416-0894-4f0c-a7c8-098cce74a3d0" 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="https://1172126658-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FgoStNEbk9Q25TX38NhdE%2Fuploads%2FTC2mnsE1z2pxyX2z24wz%2Fimage.png?alt=media&#x26;token=3ad15545-6fca-46fc-aac8-ac73fd6676a2" alt="" width="563"><figcaption></figcaption></figure>

*Learn more about the block:*

{% content-ref url="testimonials" %}
[testimonials](https://docs.foxecom.com/pebble-theme/theme-sections/testimonials)
{% 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 %}