Testimonials

This component allows you to add custom and manual Testimonies from clients, which can be used to build trust among your customers by providing feedback and/or comments you have already received about several topics.

It works by adding multiple subcomponents, called Testimony, which we will refer to as blocks for practical purposes.

Component settings

By clicking on the component name you will find general options to customize it, which will determine how the section will look and behave. The available options for this component are the following:

Columns on desktop & mobile

Allows to define the amount of columns in which blocks will be displayed for desktop and mobile devices, which will vary depending on the option you chose at the Display option, based on the definitions of the following tables:

Carousel (all devices)

Device width	Amount of columns
≥ 992px	Defined amount for desktop
≥ 768px	3 columns
≥ 415px	Defined amount for mobile
≤ 414px	1 column

Grid

Columns on desktop will apply to devices with a width ≥ 576px, while Columns on Mobile will apply to devices with a width ≤ 575px.

Desktop Device / Option value	4 columns	3 columns	2 columns	1 column
Desktop (≥ 992px)	4 columns per horizontal row	3 columns per horizontal row	2 columns per horizontal row	1 column, stacked vertically
Tablets (≥ 576px)	3 columns per horizontal row	3 columns per horizontal row	2 columns per horizontal row	1 column, stacked vertically

Mobile device / Option value	2 columns	1 column
Mobile (≤ 575px)	2 columns, stacked vertically	2 columns, stacked vertically	2 columns, stacked vertically
Small mobile (≤ 414px)	1 column, stacked vertically	1 column, stacked vertically	1 column, stacked vertically

---

Alignment

You will find options to define the alignment for the content of all blocks within the component, for desktop and mobile devices.

---

Display

Allows to define if the component content will be displayed within a section of type Carousel or Grid.

You can read more about the differences between these two types on this page.

---

Carousel options

This group of options will become visible when you choose Carousel, and they will allow you to customize its behavior.

You can find the full list of options in this page.

---

Heading options

By enabling this, a Heading section will be displayed before the component’s content. You can find the list of options in this page.

---

Testimonies options

The following group of options will allow you customize how the *blocks look and behave:

Quote icon

Allows to display a quote icon before each block text.

Avatar size

Allows to define the size for the avatar image that you can upload on each block, based on the following options:

• Small: image will display at 50x50 px dimension.
• Medium: image will display at 75x75 px dimension.
• Large: image will display at 100x100 px dimension.

Avatar shape

Allows to define the shape for the avatar image.

Card style

Allows to apply a “card” or “boxed” style to all blocks. The following options will become available when this is enabled:

• Border: displays a border (or line) all around the blocks.
• Border opacity: allows to adjust the opacity (transparency) for the border.
• Card content colors: allows to choose the Color Pack for all blocks.

---

Appearance

This group contains the following options to customize the component:

• Top margin: allows to control the upper margin of the section.
• Bottom margin: allows to control the lower margin of the section.
• Content colors: allows to choose the Color Pack for the component.

---

Animations

The Customize options allows to adjust the animations for this specific component. You can read which ones are available in this page.

---

---

Subcomponent settings

As it was mentioned before, the subcomponent for the Testimonials component is called Testimony and you can add as many as you want to provide the necessary information for your clients. The options for this subcomponent are the following:

Quote

Allows to add the comment from your customers.

Author

Optional. Allows to add the customer name, or basically anything you want.

Avatar image

Optional. Allows to upload an image (avatar) to each block.

Note: the dimension for you to upload the image it’s gonna be based on what you choose within the option Avatar size on the main component settings. We suggest you don’t upload an image larger than that to avoid unnecessary page speed issues.