A step-by-step tutorial for adding a testimonial widget to any website — WordPress, Webflow, Squarespace, or plain HTML.

You have great client reviews. Maybe they're in your email inbox, maybe in a Google Doc, maybe scattered across WhatsApp messages. But they're not on your website, where they actually convert visitors into customers.

This guide shows you how to go from zero to a live testimonial widget on your site in under 5 minutes. No coding. No developer. No design skills.

What You'll End Up With

A clean, responsive testimonial section on your website that:

  • Shows star ratings, review text, client names and photos
  • Updates automatically when you approve new reviews
  • Matches your brand colors
  • Works on desktop and mobile
  • Loads fast (under 15KB, no page speed impact)

Step 1: Create a Free Account

Go to quoted.love and sign up. You can use Google or email — takes 10 seconds.

Step 2: Create a Project

Click "+ New Project" in your dashboard. Give it a name (like "My Studio Reviews") and choose your URL slug. This will be the link you send to clients.

Customize the form if you want — change the heading, description, and brand color. Or leave the defaults. They work fine.

Step 3: Collect Your First Testimonial

You have two options:

Option A: Send the link to a client. Copy your collection link (something like quoted.love/my-studio) and send it to a happy client via email, WhatsApp, Slack, or any messenger. They'll see a simple form, fill it out in 30 seconds, and submit.

Option B: Add testimonials yourself. If you already have reviews in emails or messages, you can submit them through the form yourself on behalf of your clients (with their permission, of course).

Step 4: Approve the Testimonial

When a testimonial comes in, you'll get an email notification. Go to your dashboard, review the submission, and click "Approve". Only approved testimonials appear on your widget and Wall of Love.

Step 5: Get Your Embed Code

Go to "Embed widget" on your project page. You'll see a configurator:

  • Layout: Choose carousel, grid, wall (masonry), or list
  • Theme: Light or dark
  • Max items: Limit how many testimonials to show

The embed code updates in real time. It looks something like this:

<script
  src="https://quoted.love/widget.js"
  data-project="my-studio"
  defer
></script>

Click "Copy" to copy it to your clipboard.

Step 6: Paste It on Your Website

This is the only part that differs by platform. Here's how to do it on the most popular ones:

Plain HTML

Open your HTML file. Paste the script tag wherever you want testimonials to appear. Save. Done.

WordPress

Go to the page where you want testimonials. Add a Custom HTML block (in Gutenberg editor). Paste the embed code. Update the page.

If you're using Elementor: add an HTML widget, paste the code, save.

Webflow

Open the page in the Designer. Add an Embed element where you want the widget. Paste the code. Publish.

Squarespace

Edit the page. Add a Code Block (under "More" in the block menu). Paste the embed code. Toggle off "Display Source." Save.

Wix

Add an Embed HTML element from the "Add" menu. Paste the code in the "Code" tab. Adjust the size if needed. Publish.

Shopify

Go to Online Store → Themes → Edit Code. Find the template where you want testimonials (usually page.liquid or index.liquid). Paste the embed code. Save.

Carrd

Add a new Embed element. Choose "Code." Paste the script. Set type to "Head/body." Save and publish.

Step 7: You're Done

Refresh your website. The testimonial widget should appear with your approved reviews. When you approve new testimonials in your dashboard, they'll automatically appear on your site — no code changes needed.

Bonus: Wall of Love

Every project also gets a public Wall of Love page at quoted.love/your-slug/wall. This is a standalone page showing all your approved testimonials in a beautiful masonry grid.

You can link to it from your navigation, email signature, or social media bio. It's a great alternative if you don't want to embed a widget directly.

Troubleshooting

Widget doesn't appear? Make sure you have at least one approved testimonial. The widget won't render if there's nothing to show.

Widget looks wrong? Check that the script tag is inside the <body>, not the <head>. The defer attribute ensures it loads after the page.

Widget overlaps other content? Try wrapping it in a container <div> with some padding.

What's Next

Once your widget is live, send the collection link to more clients. The more testimonials you have, the more convincing your social proof becomes. Five quality reviews is a great starting point. Ten is even better.

Get started free at quoted.love →

Ready to try Quoted?

All features free during early access. No credit card, no limits.

Start Collecting — It's Free