How to Add Testimonials on Your Website

Jotform’s Testimonials widget lets you showcase customer feedback on your website. Add testimonials to highlight customers’ experiences with your products or services and give visitors a better idea of what your business offers.

Whether you want to feature customer reviews, share positive experiences, or build trust with potential customers, the Testimonials widget helps you present feedback in a clear, organized layout.

Setting Up Your Testimonials Widget

To embed a Testimonials on your website, you’ll first need to set up the Testimonials widget and copy the embed code for it. Here’s how to get going:

1. On the top-left side of your Workspace page, click on Create.

2. Then, in the menu that opens up, select Website Widget.

3. Next, in the Search bar in the upper-left corner of the Choose Website Widget window, enter Testimonials.
4. Then, at the bottom of the search results, click on Use Widget.

5. Now, in the Widget Properties menu that opens on the right side of Website Widgets, set up these properties:
   • Title — Enable or disable the title displayed at the top of your website widget, then enter the title you want to display in the input field once enabled.
   • Widget Header — Enable or disable the header displayed above your website widget.
   • Header Title — Enter the heading you want to display in the widget header.
   • Testimonials — Manage the testimonials displayed in your website widget. Each testimonial includes the following actions:
     • Edit — Click on Pencil icon to edit the testimonial’s details.
     • Duplicate — Click on Duplicate icon to create a copy of the testimonial.
     • Delete — Click the Trash can icon to remove the testimonial from your website widget.
     • Add testimonial — Click this button to add a new testimonial to your website widget.

6. Then, scroll down and continue to set up these properties:
   • Testimonial Details — Tick or untick the checkboxes to show or hide the following information on each testimonial:
     • Reviewer Picture — Display the reviewer’s profile picture.
     • Reviewer Name — Display the reviewer’s name.
     • Reviewer Title — Display the reviewer’s job title or position.
     • Rating — Display the testimonial’s star rating.
     • Date — Display the date of the review.
     • Verified Badge — Display a badge indicating that the reviewer is verified.
     • Company Logo — Display the reviewer’s company logo.
   • Read More Text — Enter the text displayed on the link that visitors click to expand a shortened testimonial.
   • Verified Text — Enter the text displayed beside the verified badge.
   • Widget Logo — Choose how to add a logo to the badge and widget header from the Dropdown menu. Enter the image URL in the input field and click on Insert Image URL to add the logo.
   • Open Links in New Tab — Enable this option to open reviewer and company links in a new browser tab.

7. Next, under the Style tab, customize these properties:
   • Theme — Click on the Downward Arrow icon and select a theme to apply to the widget.
   • Corner Radius — Choose the corner style of the widget elements: Square, Rounded, or Circular.
   • Jotform Branding — Show or hide Powered by Jotform in the widget.
   • Font — Toggle this on, click on the Downward Arrow icon below it, and select Site Font to match your website’s font, System to use each visitor’s device font, or another available font.
   • Custom CSS — Toggle this on, and then in the Code Editor below it, enter custom CSS code to apply advanced styling to the widget.

8. Then, under the Layout tab, configure these properties:
   • Layout options — Select one of the following options to customize how testimonials are displayed:
     • Carousel — Display testimonials in a carousel that visitors can navigate using arrows.
     • Slider — Display testimonials in a slider format.
     • Badge — Display testimonials in a badge format.
     • Grid — Arrange testimonials in a grid layout.
     • List — Display testimonials in a list layout.
     • Masonry — Arrange testimonials in a masonry-style layout.
   • Full Width — Toggle this on to make the widget use its full width.
   • Navigation arrows — Enable this option to show arrows for navigating through the Carousel and Slider layouts.
   • Pagination — Enable this option to display pagination dots where supported.
9. Once everything’s set, in the pink navigation bar at the top of the page, click on Publish.

10. Then, in the Embed section, click on Copy Code, and, if you already know how, paste that into the Embed section on your platform, and you’re good to go.
11. To view embedding instructions for your widget, click on Platforms in the menu on the left side of the page.

12. Next, in the Platforms section on the right, select the platform you want to view embedding instructions for. Or, use the Search bar at the top of the section to find it easily. 

13. Then, follow the steps in the How to Embed Your Widget section to add it to your website.

That’s it! Your Testimonials widget will appear on your website with the design and settings you selected for it. See the screenshot below for an example of how it’ll look:

Updating Your Testimonials Content

You can update your Testimonials widget at any time after it’s embedded on your website. Here’s a quick how-to:

1. At the top of your Workspace page, click on Filter.
2. Then, in the Dropdown menu that opens, hover your mouse over Website Widgets, and on the right side of it, click on Only.

3. Next, hover your mouse over the Testimonials widget you want to update, then click on Edit Widget on the right side of the page.

4. Now, in the Widget Properties menu that opens on the right side of Website Widgets, in the Testimonials section, click on Pencil icon next to the testimonial you want to update. 

5. Then, in the Edit menu that opens, update the Testimonial details you want to change:
   • Quote — Edit the testimonial text you want to display.
   • Reviewer Name — Edit the name of the person who provided the testimonial.
   • Reviewer Caption — Edit the reviewer’s title or role.
   • Rating — Select the star rating for the testimonial from the Dropdown menu.
   • Date — Set the date associated with the testimonial.
   • Verified Customer — Enable this option to display a verified customer badge on the testimonial.
   • Social Profile URL — Enter the URL of the reviewer’s social media profile.

6. Now, scroll down and continue to update these things:
   • Website URL — Enter the reviewer’s website URL.
   • Reviewer Image — Select Upload Image or Image URL from the Dropdown menu to add the reviewer’s image.
   • Company Logo — Select Upload Image or Image URL from the Dropdown menu to add the company’s logo.
7. Once your changes are complete, click on Save.
8. Then, in the upper-right corner of the menu, click on Back to close it.

9. To change the order of a testimonial, click on and hold the Six Dots icon on the left side of it to grab it, and then move it to where you want it.
10. To remove an episode, click on the Trash Can icon on the right side of it.

That’s it. You’ve successfully updated your Testimonials.

Discover

Website Widgets

Supercharge your website with interactive widgets that empower visitors to take action.

Discover Now