Next.js (Pages Router)

For projects using the older Pages Router (pages/ directory), the script goes in either pages/_document.tsx or pages/_app.tsx.

Install#

No package install needed. Replace YOUR_PROJECT_ID with the value from /v1/projects.

Add the script#

In pages/_app.tsx, use Next's <Script> component:

import Script from 'next/script';
import type { AppProps } from 'next/app';

export default function App({ Component, pageProps }: AppProps) {
  return (
    <>
      <Script id="showtrust-config" strategy="afterInteractive">
        {`window.SHOWTRUSTTO_WIDGET_CONFIG = { projectId: 'YOUR_PROJECT_ID' };`}
      </Script>
      <Script
        src="https://app.showtrust.to/showtrustto-widget.js"
        strategy="afterInteractive"
      />
      <Component {...pageProps} />
    </>
  );
}

Add the container#

Drop the container <div> wherever the wall of love should render:

<div id="showtrustto-widget" />