Shapo Review Widgets let you embed your product/service reviews on any Next.js or Reach page using Shapo’s official npm package.
NPM package: https://www.npmjs.com/package/shapo-review-widgets
1) Install the package
npm i shapo-review-widgets
# or
yarn add shapo-review-widgets
# or
pnpm add shapo-review-widgets
2) Add the widget (Next.js App Router)
Because widgets run in the browser, render them from a Client Component. The simplest option is to make the page a Client Component.
Example (App Router): app/page.tsx
'use client'
import { ShapoWidget } from 'shapo-review-widgets'
export default function Page() {
return (
<main>
<h1>Reviews</h1>
<ShapoWidget widgetId="abc123def456" />
</main>
)
}
3) Configure your widget
Follow the package README for the exact props/config required for your Shapo account (IDs, tokens, and widget settings).
Notes
If you’re using the Pages Router, render the widget inside a component used by
pages/*.tsx.If you run into SSR errors, ensure the widget is only rendered in a Client Component (
'use client').