> For the complete documentation index, see [llms.txt](https://halosoft.gitbook.io/ella-7-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://halosoft.gitbook.io/ella-7-documentation/sections-and-blocks/testimonial-section.md).
# Testimonial Section
The Testimonial section is a flexible layout designed to highlight customer feedback and brand credibility. It can easily combine with multiple blocks, allowing you to showcase quotes, ratings, or client stories in various formats.
## There are 2 ways to add a Section to your store
### **1. Add a pre-made section from our demo?**
[Read the instructions here](/ella-7-documentation/sections-and-blocks/get-section-on-demo.md)
### **2. Add the Testimonial section** manually**?**
* From your Shopify admin, go to **Online Store ->** **Themes**.
* Find the theme that you want to edit, and then click **Customize**.
* In the **Templates ->** **Add section ->** choose **Testimonial.**
This section is built based on the **Custom Section** and reusable blocks such as **Group, Heading, Text, Icon, Image**, etc. Below are the basic settings that allow you to customize the layout of this section.
If you have difficulty creating your own Testimonial section, please refer to the pre-built sections available **here**.
### Testimonial - Settings Guide
Here, you can adjust parameters related to Layout, Rich Media, and Customization Options.
These settings are inherited from the Custom Section, and you can find more detailed information about the settings.
Testimonial Section - Settings Guide
#### Layout & Direction Settings
| Setting | Type | Default | Options | Description |
| ----------------------------- | ------ | ------------ | ----------------------------------------------------------------------- | --------------------------------------------- |
| Content Direction | select | "column" | column, row, column-reverse, row-reverse | Main content flow direction |
| Content Direction (Mobile) | select | "column" | column, row, column-reverse, row-reverse | Mobile content flow direction |
| Horizontal Alignment | select | "flex-start" | flex-start, center, flex-end, space-between, space-around, space-evenly | Horizontal alignment of content |
| Vertical Alignment | select | "center" | flex-start, center, flex-end, stretch | Vertical alignment of content |
| Horizontal Alignment (Column) | select | "flex-start" | flex-start, center, flex-end | Horizontal alignment when direction is column |
| Vertical Alignment (Column) | select | "center" | flex-start, center, flex-end, stretch | Vertical alignment when direction is column |
| Gap | range | 32 | 0-100px (step: 1) | Gap between child elements |
#### Section Dimensions Settings
| Setting | Type | Default | Options | Visibility | Description |
| --------------------- | ------ | ------------ | ------------------------------------------------------------- | -------------------------- | -------------------------------- |
| Section Width | select | "page-width" | page-width, full-width, custom | - | Section container width |
| Page Width Custom | range | 1570 | 1000-2000px (step: 10) | Section Width is "custom" | Custom page width |
| Section Height | select | "" | auto, adapt\_image, small, medium, large, full-screen, custom | - | Section height behavior |
| Section Height Custom | range | 50 | 0-100% (step: 1) | Section Height is "custom" | Custom section height percentage |
#### Appearance Settings
| Setting | Type | Default | Options | Visibility | Description |
| ------------------------- | ------------- | ---------- | ------------------ | --------------------------- | --------------------- |
| Color Scheme | color\_scheme | "scheme-1" | - | - | Section color scheme |
| Background Media | select | "none" | none, image, video | - | Background media type |
| Video | video | - | - | Background Media is "video" | Background video file |
| Video Position | select | "cover" | cover, contain | Background Media is "video" | Video positioning |
| Background Image | image\_picker | - | - | Background Media is "image" | Background image |
| Background Image Position | select | "cover" | cover, fit | Background Media is "image" | Image positioning |
#### Border & Effects Settings
| Setting | Type | Default | Options | Visibility | Description |
| ------------------ | -------- | ----------- | ------------------ | ------------------------------------------------------ | ------------------------- |
| Border | select | "none" | none, solid | - | Border style |
| Border Width | range | 1 | 0-10px (step: 0.5) | Border is not "none" | Border width |
| Border Radius | range | 0 | 0-100px (step: 1) | - | Border radius |
| Toggle Overlay | checkbox | false | - | - | Enable background overlay |
| Overlay Color | color | "#00000026" | - | Toggle Overlay is true | Overlay color with alpha |
| Overlay Style | select | "solid" | solid, gradient | Toggle Overlay is true | Overlay style type |
| Gradient Direction | select | "to top" | to top, to bottom | Toggle Overlay is true and Overlay Style is "gradient" | Gradient direction |
#### Animation Settings
| Setting | Type | Default | Options | Visibility | Description |
| -------------- | ------ | ------- | -------------------------------- | --------------------------- | ------------------------ |
| Image Behavior | select | "none" | none, ambient, zoom-in, parallax | Background Media is "image" | Image animation behavior |
**Animation Options:**
* `none` - No animation
* `ambient` - Ambient movement effect
* `zoom-in` - Zoom in on scroll
* `parallax` - Parallax scroll effect
#### Padding Settings
| Setting | Type | Default | Description |
| -------------------- | ----- | ------- | ------------------------ |
| Padding Block Start | range | 36 | Top padding (0-100px) |
| Padding Block End | range | 36 | Bottom padding (0-100px) |
| Padding Inline Start | range | 0 | Left padding (0-100px) |
| Padding Inline End | range | 0 | Right padding (0-100px) |
The content inside is set up based on the **Testimonial block**. You can find more information [\[here\]](/ella-7-documentation/sections-and-blocks/testimonial-section/testimonial-block.md).
## Need More Help?
If you experience any difficulties or require extra support with your Ella theme, feel free to contact our support team through our [Ticket System](https://halosoft.ticksy.com/) — we’ll get back to you within 24 hours.
Simply scan the QR code below to join our Facebook community and stay updated with the latest news, tips, and announcements.