> For the complete documentation index, see [llms.txt](https://help.fluorescent.co/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.fluorescent.co/cornerstone/pages/theme-sections/testimonials.md).

# Testimonials

The **Testimonials** section displays rotating quotes from customers for your products with feature images and links.

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

{% hint style="warning" %}
**Editing templates will change all pages that use the same template**. [Create new templates](/cornerstone/general/editing-themes/using-templates.md#create-and-assign-multiple-templates) for different page layouts, or [show dynamic page content](/cornerstone/general/adapting-your-theme/dynamic-content-with-metafields.md) in the same template.
{% endhint %}

## Set up section

***

In the editor side panel, click **(+) Add section** and select **Testimonials**. Click and hold the drag handles **`⋮⋮`** to re-order sections.

### Section styles

Sections include general styles. Click the section to find options for **colors**, **spacing**, and **animations**.

<table data-view="cards"><thead><tr><th align="center"></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td align="center"><mark style="color:blue;"><strong>Section colors</strong></mark></td><td><a href="/pages/CBsbGCpJAMAjEg83Oxwb#section-colors">/pages/CBsbGCpJAMAjEg83Oxwb#section-colors</a></td></tr><tr><td align="center"><mark style="color:blue;"><strong>Section spacing</strong></mark></td><td><a href="/pages/CBsbGCpJAMAjEg83Oxwb#section-padding">/pages/CBsbGCpJAMAjEg83Oxwb#section-padding</a></td></tr><tr><td align="center"><mark style="color:blue;"><strong>Section animations</strong></mark></td><td><a href="/pages/CBsbGCpJAMAjEg83Oxwb#section-animations">/pages/CBsbGCpJAMAjEg83Oxwb#section-animations</a></td></tr></tbody></table>

## Add testimonial blocks

***

Add column blocks with **images**, **videos**, **text**, and/or **buttons**.

* In the Testimonial section, click **(+) Add Testimonial**.
* Click and hold the drag handles **`⋮⋮`** to rearrange the blocks.
* Click the **Testimonial block** to add content.

### Add quote and author

***

Add the author's name, optional author image, and their testimonial text.

`Click Testimonials block to find settings`

<table><thead><tr><th width="205">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Show author image</mark></td><td>Choose to display a small profile image of the testimonial author.</td></tr><tr><td><mark style="color:blue;">Author image</mark></td><td>Add an image to be used as the reviewer's profile picture.</td></tr><tr><td><mark style="color:blue;">Author</mark></td><td>Add the name of the person being quoted.</td></tr><tr><td><mark style="color:blue;">Testimonial</mark></td><td>Add the reviewer's quote for the testimonial.</td></tr></tbody></table>

### **Show product rating**

***

Display a star rating below the author's name.

`Click Testimonials block to find settings`

<table><thead><tr><th width="188">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Show rating</mark></td><td>Choose to show a star rating given by the testimonial author.</td></tr><tr><td><mark style="color:blue;">Rating</mark></td><td>Add a star rating to the testimonial, between 0 and 5 stars.</td></tr><tr><td><mark style="color:blue;">Rating star color</mark></td><td>In the section settings, select a color of the rating stars to use the <strong>Product rating star</strong>, <strong>Accent</strong>, or <strong>Current text color</strong> from your settings.</td></tr></tbody></table>

### **Select featured product**

***

If the customer's testimonial is about a specific product, show the product with a custom image.

`Click Testimonials block to find settings`

<table><thead><tr><th width="191">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Product</mark></td><td>Select the product you want to display below the testimonial.</td></tr><tr><td><mark style="color:blue;">Custom image</mark></td><td>Replace the product image with another image.</td></tr></tbody></table>

## Testimonial style

***

In the section settings, change the testimonial layout and options.

`Click Testimonials section to find settings`

<table><thead><tr><th width="215">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Number of columns on desktop</mark></td><td>Choose how many items to display in each row: between 2 and 4 columns.</td></tr><tr><td><mark style="color:blue;">Truncate text</mark></td><td>Choose to show a border around the testimonials.</td></tr><tr><td><mark style="color:blue;">Show verified review badges</mark></td><td>Choose to display a “Verified review” label and icon below the author’s name.</td></tr><tr><td><mark style="color:blue;">Product thumbnail size</mark></td><td>Increase or decrease the size of the selected product: between <strong>40px</strong> and <strong>80px</strong>.</td></tr><tr><td><mark style="color:blue;">Text alignment</mark></td><td>Align the content of the testimonials to the <strong>Left</strong>, <strong>Center</strong>, or <strong>Right</strong>.</td></tr></tbody></table>

### Show text box

***

Enable the **text box** to display the testimonial blocks inside a container. Change the text and background **colors**, and choose to show **shadows** or **borders** around the text box.

`Click Testimonials section to find settings`

<table><thead><tr><th width="203">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Show text box</mark></td><td>Display testimonial blocks within a container.</td></tr><tr><td><mark style="color:blue;">Text box style</mark></td><td>Display boxes with a <strong>Soft drop shadow</strong>, <strong>Solid drop shadow</strong>, or <strong>Borders</strong> with different thicknesses.</td></tr><tr><td><mark style="color:blue;">Color scheme</mark></td><td>Change the color scheme applied to the text box.<br><br>Use the <strong>Default</strong> color scheme from your theme settings or select a variant scheme based on the default: either <strong>Inverse</strong>, <strong>Soft</strong>, <strong>Accent</strong>, or <strong>Sale</strong>. You can also select a <strong>custom color scheme.</strong> <a href="/pages/7UqaWJHr530MKWscpEMp#color-schemes">Learn more</a>.</td></tr><tr><td><mark style="color:blue;">Override with custom colors</mark></td><td>Use custom colors for this section to override the color scheme.</td></tr><tr><td><mark style="color:blue;">Text color</mark></td><td>Select a custom color for text within the text box.</td></tr><tr><td><mark style="color:blue;">Background color</mark></td><td>Select a custom color for the background of text box.</td></tr></tbody></table>

## Section header

***

The **Section header** appears above the section. Add a **heading**, **subheading**, and optional **button**.

`Click Testimonials section to find settings`

<table><thead><tr><th width="216">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Center header content</mark></td><td>Display headings as center-aligned within section. Uncheck this option to align headings to the left.</td></tr><tr><td><mark style="color:blue;">Accent</mark></td><td>Add a small heading label above section heading.</td></tr><tr><td><mark style="color:blue;">Heading</mark></td><td>Add text to show a main heading.</td></tr><tr><td><mark style="color:blue;">Subheading</mark></td><td>And multiple lines of text below the main heading.</td></tr><tr><td><mark style="color:blue;">Maximum text width</mark></td><td>Set the maximum width of heading text between <strong>400</strong> and <strong>1000</strong> <strong>px</strong>.</td></tr><tr><td><mark style="color:blue;">Button link</mark></td><td>Select or paste a URL for a button.</td></tr><tr><td><mark style="color:blue;">Button label</mark></td><td>Enter text to display as the button label.<br><br>The most effective button labels ask customers to do something (e.g. Get started, Join us, Shop now).</td></tr><tr><td><mark style="color:blue;">Button style</mark></td><td>Choose a style for the button. Select <strong>Solid</strong>, <strong>Outline</strong>, or <strong>Text</strong>.</td></tr><tr><td><mark style="color:blue;">Button position</mark></td><td>Position the button in the section <strong>Header</strong> or <strong>Footer</strong>.</td></tr></tbody></table>

\\

***

> **Related links**\
> [Multi-column](/cornerstone/pages/theme-sections/multi-column.md)\
> [Rich text](/cornerstone/pages/theme-sections/rich-text.md)