Add Widgetjoy to Next.js

Add the Script component to your root layout, then deploy.

app/layout.tsx

import Script from "next/script"

<Script src="https://widgetjoy.com/s/your-site.js" strategy="afterInteractive" />

Your Dashboard shows this line with your own site in it.

Three steps in Next.js

Open the root layout

app/layout.tsx, or pages/_document.tsx on the pages router.
app
- layout.tsx
- page.tsx
- globals.css
Add the Script inside the body

After the page is interactive is soon enough.
app/layout.tsx
```
<body>  {children}  <Script src="…" /></body>
```
Deploy and load a page

Then come back here: this screen turns green once your site has loaded Widgetjoy.

Load any page of your published site.
Your Dashboard’s Install screen turns green once your site has loaded Widgetjoy.

Something else? Write to us.

Why isn’t it on my site yet?

Deploy the change, then load a page of the deployed site.

Where in the page does it go?

Anywhere works. The line loads after your page, so it never holds it up.

My site sets a security policy.

Allow https://widgetjoy.com in script-src and connect-src. Nothing else is needed.