Blog
Tutorials
How To Create A User Generated Testimonial Feature

How To Create A User Generated Testimonial Feature

connor finlayson
Connor Finlayson
October 26, 2022

In this tutorial, I’m going to show you how to build a fully automated testimonial section for your Webflow CMS pages. Whether you’re running a marketplace, a directory, or an e-commerce store, this approach will help you display dynamic, page-specific testimonials without any manual updates.

Here’s what we’ll cover:

  • Designing and styling the testimonial section in Webflow.
  • Setting up linked collections to connect testimonials with specific pages.
  • Using Airtable to manage testimonial data.
  • Automating the entire workflow with Make.com.

By the end of this tutorial, you’ll have a seamless, scalable system that keeps your site fresh and professional while saving you time and effort.

Join My Automation & No-Code Newsletter

Join 13k+ entrepreneurs and receive tutorials, tips, and strategies for building smarter digital products using no-code, AI, and automation.

Thank you! We will reach out when we have updates!
Oops! Something went wrong while submitting the form.
A screenshot of a workflow automation software interface with a sequential diagram of tasks for client approval, various icons representing actions, and a performance chart below. The interface is inactive with a message stating no scenarios or executions are currently running.

How to Design and Style a Testimonial Section in Webflow

The first step is to design the layout for your testimonial section in Webflow. Start by deciding where this section will fit within your existing site. For example, you might add it beneath a freelancer’s profile or a product page.

To speed up the design process, you can use pre-designed components from tools like Relume, which offers a variety of layouts for Webflow. Simply copy your preferred testimonial layout, paste it into your Webflow project, and customize the styles to fit your branding.

After structuring the section, refine the design by adding elements such as the client’s name, job title, company, and testimonial text. Keep the layout clean and readable for a polished look.

Setting Up Linked Collections in Webflow CMS

Dynamic content is the heart of this workflow. In Webflow CMS, create a new collection called “Testimonials” with fields for:

  • Testimonial text
  • Client name
  • Job title and company
  • Client image

Next, add a reference field to link testimonials to other collections, such as freelancers or products. This connection ensures each testimonial is displayed on the correct CMS page. Not sure how to structure your collections? Check out my guide on building relational CMS collections in Webflow for additional tips.

How to Organize Data with Airtable

Managing your testimonial data in Airtable makes it easy to scale as your business grows. Start by creating a table with fields matching your Webflow CMS, including a status field for approval workflows. Airtable’s flexibility lets you handle everything from client information to approval statuses seamlessly.

For more insights into using Airtable effectively, see my detailed overview on Airtable.

Automating Testimonial Management with Make.com

Automation is where the magic happens. Using Make.com, you can connect Airtable to Webflow, ensuring that approved testimonials are automatically added to your site.

Here’s a quick outline of the workflow:

  1. Trigger: Set Make.com to watch Airtable for new or updated records in a filtered view (e.g., “Approved Testimonials”).
  2. Action 1: Send the testimonial data from Airtable to Webflow, mapping each field appropriately.
  3. Action 2: Update Airtable with the Webflow item ID for future reference.

For a deeper dive into Make.com’s capabilities, read my tutorial on streamlining workflows with Make.com.

Scaling and Enhancing Your Testimonial Section

Once the basics are in place, you can scale this feature further:

  • Client Submission Forms: Allow clients to submit testimonials directly via a Webflow or Airtable form. Tools like Jotform make this process even easier.
  • Star Ratings or Custom Fields: Add new fields to enhance the testimonial display, like a star rating system or optional logos.

As you grow, these additions will help you maintain a professional, scalable system.

Ready To Dive DEeP?

The Landing Page Engine

Learn how to set up a AI-powered programmatic landing page system

Now that we’ve gone through the entire process, you should have a fully automated testimonial section that integrates seamlessly into your Webflow CMS pages. Let’s quickly recap what we covered and why it’s valuable for your site:

  • Designing and Styling in Webflow: We started by creating a clean and visually appealing testimonial section using Relume components, making it easy to integrate into your existing design.
  • Linked Collections in Webflow CMS: You learned how to structure your CMS collections to dynamically display testimonials connected to specific pages, ensuring relevant content for users.
  • Organizing Data with Airtable: We set up a database in Airtable to manage testimonials efficiently, including fields for approvals and linking them to other collections.
  • Automation with Make.com: Finally, we automated the entire workflow, syncing Airtable data to Webflow so your site updates dynamically without manual effort.

By implementing these steps, you now have a scalable, professional system that keeps your site fresh and engaging while saving you time. Whether you’re managing an online marketplace, a directory, or an e-commerce store, this setup helps you stand out with dynamic, user-specific content.

If you’re ready to take your automation skills further, explore my other resources:

Got questions or want to share your results? Let me know—I’d love to hear how this worked for you!

  1. MVMP Labs: Join our online community for first-time founders building no-code marketplaces. Get access to exclusive resources, step-by-step guides, and a supportive network of peers who are on the same journey as you.
  2. The MVMP Mastermind: Work directly with me through 1:1 coaching, monthly group strategy calls, and personalized feedback. Ideal for founders who want accountability, faster progress, and expert guidance to build and launch successfully.
  3. Studio: Let my team handle the heavy lifting. We’ll build your automations, build entire MVPS, basically let you focus on building the business, whilst we build the systems.
  4. Learn No-Code on YouTube: Follow my free, hands-on tutorials where I teach you how to build and automate no-code marketplaces step-by-step. Subscribe here for weekly videos and start creating today.