# Image testimonials

The **Image testimonials** section allows you to display customer reviews alongside text and image. This feature provides a more engaging way to present testimonials by combining visual elements with customer feedback.

<figure><img src="https://2603381870-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FzHrRp9fYeFj0SVV6k2dP%2Fuploads%2FOnnbGCa1OqTyfTFGo8NO%2Fimage.png?alt=media&#x26;token=e0abe34c-136d-45eb-8720-186f59385022" alt=""><figcaption></figcaption></figure>

## Section settings

### General settings

<table data-full-width="false"><thead><tr><th width="143">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Section width</td><td><p></p><p>3 options for container</p><ul><li>Stretch width: span the section width regardless of screen size.</li><li>Fix width: depends on your page content width in <strong>Theme settings</strong> <strong>-></strong> <strong>Layout</strong>.</li><li>Expand full width: takes up the entire space on the page and it usually resizes itself to fit the size of the screen.</li></ul></td></tr><tr><td>Color scheme</td><td>Select colors from <strong>Theme settings -> Colors</strong></td></tr><tr><td>Heading</td><td>The title of the section</td></tr><tr><td>Description</td><td>The description of the section</td></tr><tr><td>Content alignment</td><td><p>The position of the heading and description.</p><ul><li>Left</li><li>Center</li><li>Right</li></ul></td></tr></tbody></table>

### Testimonial settings

<table data-full-width="false"><thead><tr><th width="143">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Show rating</td><td>Display customer ratings to highlight product quality and build trust.</td></tr><tr><td>Show date published</td><td>Display the publication date to inform customers of the content's recency.</td></tr><tr><td>Show author name</td><td>Display the author's name for transparency and recognition.</td></tr><tr><td>Show author info</td><td>Provide additional details about the author </td></tr></tbody></table>

### Settings

<table data-full-width="false"><thead><tr><th width="143">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Desktop image width</td><td><p>This is the percentage of the section's width occupied by the image:</p><ul><li>40%</li><li>50%</li><li>60%</li><li>70%</li></ul></td></tr><tr><td>Desktop image position</td><td>The position of the image relative to the content on desktop</td></tr><tr><td>Desktop content position</td><td>The vertical position of both the image and content on desktop</td></tr><tr><td>Image ratio</td><td><p>"Image ratio" refers to the proportional relationship between the width and height of the image.</p><p>5 options for image ratio</p><ul><li>Adapt to first image</li><li>Square (1:1)</li><li>Portrait (3:4)</li><li>Landscape (4:3)</li><li>Custom</li></ul></td></tr><tr><td>Custom ratio</td><td>Where you can add your own image ratio</td></tr><tr><td>Column gap</td><td>Adjust spacing between columns</td></tr></tbody></table>

### Settings for carousel

<table data-full-width="false"><thead><tr><th width="143">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Show navigation</td><td>Display the next and back controls for the carousel</td></tr><tr><td>Show pagination</td><td>Display the pagination for the carousel</td></tr><tr><td>Auto change slides</td><td>Automatically rotate slideshow</td></tr><tr><td>Change slides every second</td><td>Set how long each slide is visible before transitioning</td></tr></tbody></table>

### Section padding

* **Top padding:** Customize the top margin of the section
* **Bottom padding:** Customize the bottom margin of the section

## **Block settings**

<table data-full-width="false"><thead><tr><th width="143">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Image</td><td>Display an image to personalize the testimonial.</td></tr><tr><td>Rating star</td><td>Rating products with a star system from 1 to 5</td></tr><tr><td>Quote</td><td>Present customer feedback to share experiences and insights</td></tr><tr><td>Name</td><td>Display the name of the customer to give authenticity to their review</td></tr><tr><td>Author info</td><td>Include extra details about the customer to enrich their testimonial</td></tr><tr><td>Published</td><td>Show when the testimonial was published to indicate its freshness</td></tr></tbody></table>