Testimonials

The Testimonials element lets you display customer reviews in a neat and appealing way, helping your business look trustworthy and encouraging more people to buy from you. It offers different preset styles that you can customize to make your testimonials shine. You can also choose layouts like grid or masonry and select image types, such as avatars or static images, for a more appealing design.

To make the reviews look genuine, you can include details about the reviewer’s avatar, job title, company name, or other information. You can also arrange the reviews to highlight the most important ones at the top.

The “Testimonials” element features the following controls.

Content

Content

  • Image Type: Choose image type from static or avatar.
  • Enable Avatar: Enable the option to display the reviewer’s avatar in the testimonial (applicable when you select static as image type).
Testimonials: Image Type
Testimonials: Image Type

Testimonial List

  • Avatar: Upload the avatar of the reviewer.
  • Author Name: Enter the author’s name.
  • Designation: Enter the author’s designation.
  • Company Name: Enter the author’s company name.
  • Heading: Enter the heading.
Testimonials: Content Settings
Testimonials: Content Settings
  • Description: Enter the description.
  • Rating: Specify the rating value.
Testimonials: Content Settings
Testimonials: Content Settings

Style(for individual list items)

  • Background: Choose the background of an individual item.
Testimonials: Individual List Styling
Testimonials: Individual List Styling
  • Heading HTML Tag: Select the HTML tag for heading.
Testimonials: Select Heading HTML Tag
Testimonials: Select Heading HTML Tag

Layout

  • Layout: Choose layout from Grid or Masonry.
  • Columns: Specify the number of columns.
  • Column Gap: Specify the gap between columns.
  • Row Gap: Specify the gap between rows.
Testimonials: Layout Settings
Testimonials: Layout Settings
  • Presets: Choose presets from various options available.
  • Author Detail Position: Select the position to display the author’s details(applicable for preset 1).
  • Rating Icon Position: Select the position to display the rating icon(applicable for preset 1).
Testimonials: Preset Settings
Testimonials: Preset Settings
  • Enable Icon: Activate the option to display the icon.
    • Icon: Select the icon.
    • Position: Select the position of icon.
    • Gap: Specify the gap between icon & other content (applicable for preset 1).
    • Horizontal Offset(%): Specify the horizontal offset of icon (applicable for preset 2).
    • Vertical Offset(px): Specify the vertical offset of icon(applicable for preset 2).
Testimonials: Icon Settings
Testimonials: Icon Settings

Order

Note: These options are applicable when you select Preset 2 as preset. If any of these elements have a lower priority than others, they can be placed first on the webpage. This feature gives you greater control over the visual hierarchy of your webpage.

Choose the order of displaying individual elements, such as

  • Avatar
  • Content
  • Author Details
  • Rating
Testimonials: Content Ordering Settings
Testimonials: Content Ordering Settings

Preset Style

Box

  • Width: Specify the width of item box.
  • Background: Select the background color of box.
  • Overlay Color: Choose the overlay color(applicable when selecting static as Image type).
  • Gap: Specify the gap between content.
  • Alignment: Select the alignment of content(applicable for Preset 2).
  • Border: Select the border.
  • Box Shadow: Set the box shadow.
  • Padding: Set the padding.
Testimonials: Preset Style Settings
Testimonials: Preset Style Settings

Author

  • Background: Select the background of an author’s name.
  • Typography: Set the typography.
  • Padding: Set the padding.
  • Margin: Set the margin.
Testimonials: Author Style Settings
Testimonials: Author Style Settings

Avatar
Note: These options are applicable when you select static as Image type.

  • Background Image Position: Choose the background image position of author.
  • Background Repeat: Select the background-repeat properties.
  • Background Size: Choose the background size.
Testimonials: Avatar Style Settings
Testimonials: Avatar Style Settings

Designation

  • Background: Select the background of an author’s designation.
  • Typography: Set the typography.
Testimonials: Designation Style Settings
Testimonials: Designation Style Settings

Company Name

  • Position: Specify the position to display the company’s name.
  • Background: Select the background of a company’s name.
  • Typography: Set the typography.
  • Padding: Set the padding.
  • Margin: Set the margin.
Testimonials: Company Name Style Settings
Testimonials: Company Name Style Settings

Heading

  • Background: Select the background of a heading.
  • Typography: Set the typography.
  • Padding: Set the padding.
  • Margin: Set the margin.
Testimonials: Heading Style Settings
Testimonials: Heading Style Settings

Description

  • Background: Select the background of a description.
  • Typography: Set the typography.
  • Padding: Set the padding.
  • Margin: Set the margin.
Testimonials: Description Style Settings
Testimonials: Description Style Settings

Icon

  • Size: Specify the size of icon.
  • Color: Select the color of icon.
  • Background: Choose the background of icon.
  • Border: Set the border
  • Padding: Set the padding.
Testimonials: Icon Style Settings
Testimonials: Icon Style Settings

Rating Icon

  • Enable Rating: Activate the option to display the rating in testimonial.
    • Icon: Select the rating icon.
    • Size: Specify the size of rating icon.
    • Marked Icon Color: Select the color of marked rating icon.
    • Unmarked Icon Color: Select the color of unmarked icon.
    • Gap: Specify the gap between icons.
    • Margin: Set the margin.
Testimonials: Rating Icon Style Settings
Testimonials: Rating Icon Style Settings