# How to Use the Testimonial Element

> Add on-brand social proof in GHL Customer Care. Create testimonial grids, vertical masonry, or carousels; customize card styles, fonts, spacing, and visible details.

- Source: https://docs.ghlcustomercare.com/docs/sites/funnels-and-websites/how-to-use-the-testimonial-element
- Section: Sites / Funnels and Websites
- Reading time: 4 min
- Images: 8, each explained below

---
The Testimonials Element in GHL Customer Care’s Funnels & Websites builder makes it easy to add polished, on-brand social proof to any page. This article explains what the Testimonials Element is and how to set it up to match your brand!

---

**TABLE OF CONTENTS**

-   [What is the Testimonials Element?](#what-is-the-testimonials-element)
-   [Key Benefits of the Testimonials Element](#key-benefits-of-the-testimonials-element)
-   [Customization Options](#customization-options)
    -   [Testimonial Settings](#testimonial-settings)
    -   [Layout Options](#layout-options)
    -   [Card Style Options](#card-style-options)
-   [How To Setup the Testimonial Element](#how-to-setup-the-testimonial-element)
-   [Frequently Asked Questions](#frequently-asked-questions)
-   [Related Articles](#related-articles)

---

# **What is the Testimonials Element?**

The Testimonial Element allows users to display customer feedback directly within funnel or website pages. It provides flexible layout styles, card formatting, and content customization. This helps businesses build trust and reinforce their brand by showcasing real experiences from happy clients.

Unlike the Review Widget, which automatically pulls reviews from third-party platforms like Google or Facebook, the Testimonial Element is designed for manually entered feedback. This gives users full control over the content, order, and appearance of each testimonial. The Testimonial Element is ideal for curated quotes, in-depth client stories, or brand-specific messaging.

---

## **Key Benefits of the Testimonials Element**

Highlight real client feedback in a polished and structured format that builds credibility at a glance.

-   **Increase Social Proof:** Increases trust by showcasing real client outcomes
-   **Save Time:** Prebuilt layouts and styles reduce design time
-   **Stay On-Brand**: Reinforce brand identity by using custom fonts, colors, and styling
-   **Keep It Clean and Clear**: Allow users to expand long testimonials with a simple “Read More” link
-   **Enhance Readability and Impact**: Adjust font size, card shapes, and rating icons to make testimonials easy to scan

---

## **Customization Options**

Fine-tune how testimonials appear on your page using various styling, layout, and content display controls. The configuration panel is divided into three major areas: Testimonial Settings, Card Styles, and Layout Options.

### **Testimonial Settings**

Control what information is visible to ensure each testimonial emphasizes what matters most.

-   **Show Profile Picture**: Toggle on/off to display customer images
-   **Show Name, Caption, Date**: Display or hide details of the testimonial author
    
-   **Show Logo**: Add branding to client reviews with logo display
    
-   **Show Star Rating**: Toggle to turn on/off the visual 1–5 star rating
    

![Testimonial Settings (image 1 of 8)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155051376451/original/VhXXlHf62VHvOfcpBDvZIah5xPFRUzRT6w.png)

**Testimonial Settings (image 1 of 8)**

This screenshot appears in the "Testimonial Settings" section of "How to Use the Testimonial Element". The text alongside this image reads: Show Profile Picture: Toggle on/off to display customer images Show Name, Caption, Date: Display or hide details of the testimonial author Show Logo: Add branding to client reviews with logo display Show Star Rating: Toggle to turn on/off the visual 1–5 star rating. This part of the guide covers 1 field, listed below. Immediately after, the guide continues: Determine how testimonials are arranged on your page to best complement your content and draw attention to social proof.
- What to choose: Show Profile Picture: Toggle on/off to display customer images Show Name, Caption, Date: Display or hide details of the testimonial author Show Logo: Add branding to client reviews with logo display Show Star Rating: Toggle to turn on/off the visual 1–5 star rating
- Fields: Show Logo: Add branding to client reviews with logo display
- Controls: Show Profile Picture, Show Name, Caption, Date, Show Logo, Show Star Rating
- Next: Determine how testimonials are arranged on your page to best complement your content and draw attention to social proof.

Full procedure:

1. Show Profile Picture: Toggle on/off to display customer images
2. Show Name, Caption, Date: Display or hide details of the testimonial author
3. Show Logo: Add branding to client reviews with logo display
4. Show Star Rating: Toggle to turn on/off the visual 1–5 star rating

### **Layout Options**

Determine how testimonials are arranged on your page to best complement your content and draw attention to social proof.

Choose from three layout options:

-   **Grid**: Uniform layout that aligns testimonials in a structured block
    
-   **Vertical Masonry**: Staggered testimonial display based on content height
    
-   **Carousel**: Interactive slider for rotating testimonials
    

You can also adjust the number of **C****olumns** (0–4) and the **S****pacing** between cards using sliders for added control.

![Layout Options (image 2 of 8)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155051376378/original/S-7Ag12dys_7W6AjSpXIVGGToOaWKUKZ1A.png)

**Layout Options (image 2 of 8)**

This screenshot appears in the "Layout Options" section of "How to Use the Testimonial Element". The text alongside this image reads: You can also adjust the number of C olumns (0–4) and the S pacing between cards using sliders for added control. This part of the guide covers 1 field, listed below. Immediately after, the guide continues: Select from clean card templates and tailor typography and color options to align with your brand’s visual identity.
- What this covers: You can also adjust the number of C olumns (0–4) and the S pacing between cards using sliders for added control.
- Fields: Carousel: Interactive slider for rotating testimonials
- Controls: Grid, Vertical Masonry, Carousel, C, olumns, S, pacing
- Next: Select from clean card templates and tailor typography and color options to align with your brand’s visual identity.

Full procedure:

1. Grid: Uniform layout that aligns testimonials in a structured block
2. Vertical Masonry: Staggered testimonial display based on content height
3. Carousel: Interactive slider for rotating testimonials

### **Card Style Options**

Select from clean card templates and tailor typography and color options to align with your brand’s visual identity.

Choose from four layout options:

-   **Default**: Content above with profile/image below
-   **Reverse Center**: Image centered above text
-   **Vertical Center**: Image centered below text
-   **Horizontal**: Side-by-side profile and testimonial layout

You can also adjust additional styling factors including:

-   Adjust corner radius for rounded card borders
-   Modify font style and size for the content and author text
-   Customize colors for background, card, name, caption, content, rating, date, and “Read More” links

![Card Style Options (image 3 of 8)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155051376635/original/ody--KJH2idKHfXhwHXicP5MkfMhwohrNg.png)

**Card Style Options (image 3 of 8)**

This screenshot appears in the "Card Style Options" section of "How to Use the Testimonial Element". The text alongside this image reads: Adjust corner radius for rounded card borders Modify font style and size for the content and author text Customize colors for background, card, name, caption, content, rating, date, and “Read More” links. This part of the guide covers 6 fields, listed below. Immediately after, the guide continues: Follow these steps to add and configure the testimonial element in your page builder.
- What this covers: Adjust corner radius for rounded card borders Modify font style and size for the content and author text Customize colors for background, card, name, caption, content, rating, date, and “Read More” links
- Fields: Default: Content above with profile/image below, Reverse Center: Image centered above text, Vertical Center: Image centered below text, Horizontal: Side-by-side profile and testimonial layout, Adjust corner radius for rounded card borders, Modify font style and size for the content and author text
- Controls: Default, Reverse Center, Vertical Center, Horizontal
- Next: Follow these steps to add and configure the testimonial element in your page builder:

Full procedure:

1. Default: Content above with profile/image below
2. Reverse Center: Image centered above text
3. Vertical Center: Image centered below text
4. Horizontal: Side-by-side profile and testimonial layout

---

## **How To Setup the Testimonial Element**

Follow these steps to add and configure the testimonial element in your page builder:

#### **Step 1:** Navigate to the Page Builder

-   In the left-hand menu of your sub-account dashboard, click on **Sites**
-   Using the top navigation ribbon, select either the **Funnels** or **Websites** tab
-   Open your chosen funnel or website and click the blue **Edit** button to launch the page editor

![Step 1: Navigate to the Page Builder (image 4 of 8)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155051374556/original/rie8MQkWsDtA6Vcj3JB-7gWXwLz4Fg3e7w.png)

**Step 1: Navigate to the Page Builder (image 4 of 8)**

This screenshot appears in the "Step 1: Navigate to the Page Builder" section of "How to Use the Testimonial Element". The text alongside this image reads: In the left-hand menu of your sub-account dashboard, click on Sites Using the top navigation ribbon, select either the Funnels or Websites tab Open your chosen funnel or website and click the blue Edit button to launch the page editor. Immediately after, the guide continues: Click the Add Elements (+) button in the upper left corner Drag and drop the Testimonial element into your page layout.
- What to choose: In the left-hand menu of your sub-account dashboard, click on Sites Using the top navigation ribbon, select either the Funnels or Websites tab Open your chosen funnel or website and click the blue Edit button to launch the page editor
- Controls: Sites, Funnels, Websites, Edit
- Next: Click the Add Elements (+) button in the upper left corner Drag and drop the Testimonial element into your page layout

Full procedure:

1. In the left-hand menu of your sub-account dashboard, click on Sites
2. Using the top navigation ribbon, select either the Funnels or Websites tab
3. Open your chosen funnel or website and click the blue Edit button to launch the page editor

#### **Step 2:** Add the Testimonial Element

-   Click the **Add** **Elements (+)** button in the upper left corner
    
-   Drag and drop the Testimonial element into your page layout
    

![Step 2: Add the Testimonial Element (image 5 of 8)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155051374766/original/riq2d_PTn7ZeAZnUMwdGiTjGvjI50SVVDg.png)

**Step 2: Add the Testimonial Element (image 5 of 8)**

This screenshot appears in the "Step 2: Add the Testimonial Element" section of "How to Use the Testimonial Element". The text alongside this image reads: Click the Add Elements (+) button in the upper left corner Drag and drop the Testimonial element into your page layout. Immediately after, the guide continues: Click into the testimonial element to access the configuration panel Drag the handle (two-line icon) to reorder testimonials Click + Add Testimonial to create new entries Use the P encil icon to edit and the Trash icon to delete a….
- What to click: Click the Add Elements (+) button in the upper left corner Drag and drop the Testimonial element into your page layout
- Controls: Add, Elements (+)
- Next: Click into the testimonial element to access the configuration panel Drag the handle (two-line icon) to reorder testimonials Click + Add Testimonial to create new entries Use the P encil icon to edit and the Trash icon to delete a testimonial

Full procedure:

1. Click the Add Elements (+) button in the upper left corner
2. Drag and drop the Testimonial element into your page layout

#### **Step 3:** Add and Configure Testimonials

-   Click into the testimonial element to access the configuration panel
    
-   Drag the handle (**two-line** icon) to reorder testimonials
-   Click **\+ Add Testimonial** to create new entries
-   Use the **P****encil** icon to edit and the **Trash** icon to delete a testimonial
    

![Step 3: Add and Configure Testimonials (image 6 of 8)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155051375362/original/wG29VHp264pRj2fmHx6QCHLBUf6IXoQm-g.png)

**Step 3: Add and Configure Testimonials (image 6 of 8)**

This screenshot appears in the "Step 3: Add and Configure Testimonials" section of "How to Use the Testimonial Element". The text alongside this image reads: Click into the testimonial element to access the configuration panel Drag the handle (two-line icon) to reorder testimonials Click + Add Testimonial to create new entries Use the P encil icon to edit and the Trash icon to delete a testimonial. Immediately after, the guide continues: Use the Pencil icon to open the testimonial editor Edit fields such as name, caption, date, star rating, profile photo, profile URL, business URL, and logo.
- What to click: Click into the testimonial element to access the configuration panel Drag the handle (two-line icon) to reorder testimonials Click + Add Testimonial to create new entries Use the P encil icon to edit and the Trash icon to delete a testimonial
- Controls: two-line, + Add Testimonial, P, encil, Trash
- Next: Use the Pencil icon to open the testimonial editor Edit fields such as name, caption, date, star rating, profile photo, profile URL, business URL, and logo

Full procedure:

1. Click into the testimonial element to access the configuration panel
2. Drag the handle (two-line icon) to reorder testimonials
3. Click + Add Testimonial to create new entries
4. Use the P encil icon to edit and the Trash icon to delete a testimonial

#### **Step 4:** Edit Testimonials

-   Use the **Pencil** icon to open the testimonial editor
-   Edit fields such as name, caption, date, star rating, profile photo, profile URL, business URL, and logo
    

![Step 4: Edit Testimonials (image 7 of 8)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155051375421/original/rpQ0MK9gyYIDlWAw5oOJ1mNEgk49H2uBFg.png)

**Step 4: Edit Testimonials (image 7 of 8)**

This screenshot appears in the "Step 4: Edit Testimonials" section of "How to Use the Testimonial Element". The text alongside this image reads: Use the Pencil icon to open the testimonial editor Edit fields such as name, caption, date, star rating, profile photo, profile URL, business URL, and logo. Immediately after, the guide continues: Use Testimonial Settings to choose which elements to display, such as profile pictures, names, dates, logos, and star ratings Select a layout in the Layout Options to arrange testimonials as a grid, carousel, or masonry display, and….
- What this covers: Use the Pencil icon to open the testimonial editor Edit fields such as name, caption, date, star rating, profile photo, profile URL, business URL, and logo
- Controls: Pencil
- Next: Use Testimonial Settings to choose which elements to display, such as profile pictures, names, dates, logos, and star ratings Select a layout in the Layout Options to arrange testimonials as a grid, carousel, or masonry display, and control column and spacing settings Choose a card style in Card Style Options, and then personalize fonts, borders, and other styling Refine the design using the Size and Color Options to match your brand’s aesthetic with custom fonts, colors, and sizing

Full procedure:

1. Use the Pencil icon to open the testimonial editor
2. Edit fields such as name, caption, date, star rating, profile photo, profile URL, business URL, and logo

#### **Step 5:** Customize the Look and Layout of Your Testimonials

-   Use **Testimonial Settings** to choose which elements to display, such as profile pictures, names, dates, logos, and star ratings
    
-   Select a layout in the **Layout Options** to arrange testimonials as a grid, carousel, or masonry display, and control column and spacing settings
    
-   Choose a card style in **Card Style Options**, and then personalize fonts, borders, and other styling
    
-   Refine the design using the **Size and Color Options** to match your brand’s aesthetic with custom fonts, colors, and sizing
    

![Step 5: Customize the Look and Layout of Your Testimonials (image 8 of 8)](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155051376882/original/umQMlKFX5cO79tEBBBj1Np4LKPXTiHkG1Q.png)

**Step 5: Customize the Look and Layout of Your Testimonials (image 8 of 8)**

This screenshot appears in the "Step 5: Customize the Look and Layout of Your Testimonials" section of "How to Use the Testimonial Element". The text alongside this image reads: Use Testimonial Settings to choose which elements to display, such as profile pictures, names, dates, logos, and star ratings Select a layout in the Layout Options to arrange testimonials as a grid, carousel, or masonry display, and control column and spacing settings Choose a card style in Card…. Immediately after, the guide continues: Q: Can I pull testimonials from Google or Facebook reviews? No, this element supports only manually added testimonials. Use the Review Widget for external review sources.
- What to choose: Use Testimonial Settings to choose which elements to display, such as profile pictures, names, dates, logos, and star ratings Select a layout in the Layout Options to arrange testimonials as a grid, carousel, or masonry display, and control column and spacing settings Choose a card style in Card Style Options, and then personalize fonts, borders, and other styling Refine the design using the Size and Color Options to match your brand’s aesthetic with custom fonts, colors, and sizing
- Controls: Testimonial Settings, Layout Options, Card Style Options, Size and Color Options
- Next: Q: Can I pull testimonials from Google or Facebook reviews? No, this element supports only manually added testimonials. Use the Review Widget for external review sources.

Full procedure:

1. Use Testimonial Settings to choose which elements to display, such as profile pictures, names, dates, logos, and star ratings
2. Select a layout in the Layout Options to arrange testimonials as a grid, carousel, or masonry display, and control column and spacing settings
3. Choose a card style in Card Style Options, and then personalize fonts, borders, and other styling
4. Refine the design using the Size and Color Options to match your brand’s aesthetic with custom fonts, colors, and sizing

---

## **Frequently Asked Questions**

**Q: Can I pull testimonials from Google or Facebook reviews?**  
No, this element supports only manually added testimonials. Use the Review Widget for external review sources.

**Q: Does the testimonial element support dynamic content?**  
No, this is a static content block. You need to add and update testimonials manually.

**Q: Is there a way to truncate long testimonials with a "Read More" link?**  
Yes, long testimonials automatically shorten with an optional “Read More” expansion.

**Q: Can I reorder the testimonials?**  
Yes, use the drag handle to change the testimonial order.

**Q: Are there character limits on testimonial content?**  
A: There are no fixed limits, but long entries will be truncated and expandable using the "Read More" link.

---

## **Related Articles**

-   [Customizing Review Widgets in Reputation](https://docs.ghlcustomercare.com/docs/reputation-management-and-reviews/review-requests/customizing-review-widgets-in-reputation)
-   [Sites Overview](https://docs.ghlcustomercare.com/docs/sites/funnels-and-websites/websites-overview)
-   [Getting Started - Launch A Funnel](https://docs.ghlcustomercare.com/docs/getting-started-w-ghl-customer-care/foundational-setup/how-top-launch-a-ghl-customer-care-funnel)
-   [Using the New Revamped Sidebar in Funnel & Website Builders](https://docs.ghlcustomercare.com/docs/sites/funnels-and-websites/using-the-new-revamped-sidebar-in-funnel-website-builders)

---

Documentation for GHL Customer Care. Support: support@ghlcustomercare.com