Docs › React and Next.js

Add a testimonial wall to React and Next.js

A small React component that renders a Vouchjar testimonial wall, for Next.js, Vite or any React app.

You’ll need a Vouchjar wall. It’s free for up to 5 testimonials: create one, then copy the embed code from step 3 of your dashboard. It already has your wall’s ID in place of your-wall.

components/Vouchjar.jsx
'use client';
import { useEffect } from 'react';

export default function Vouchjar({ wall, layout = 'grid' }) {
  useEffect(() => {
    if (window.Vouchjar) return window.Vouchjar.scan();
    const s = document.createElement('script');
    s.src = 'https://vouchjar.com/embed.js';
    s.async = true;
    document.body.appendChild(s);
  }, [wall]);
  return <div data-vouchjar={wall} data-layout={layout} />;
}

Steps

  1. Save the component below in your project, for example components/Vouchjar.jsx.
  2. Render <Vouchjar wall="your-wall" /> wherever the wall should appear.
  3. It loads the script once and re-scans after client-side navigation, so the wall appears on every route that renders it.

Good to know

What you’ll get

This is the real widget running the demo wall. Yours shows the testimonials you approve.

Collect your first testimonial free

Other platforms