Next.js ads: sell sponsor spots on Next.js

<script src="https://cdn.sponsor.st/s.js" data-site="YOUR_KEY" async></script>

Add Sponsor.st to Next.js

1. Get your snippet. Create a free account, add your site and copy the tag from the site's page; your key is filled in.

2. Paste it. Open your root layout (app/layout.tsx, or pages/_document.tsx). Paste the snippet inside <body> as a plain <script async> tag, not next/script, so it's in the page source. Deploy.

   export default function RootLayout({ children }: { children: React.ReactNode }) {
     return (
       <html lang="en">
         <body>
           {children}
           <script src="https://cdn.sponsor.st/s.js" data-site="YOUR_KEY" async></script>
         </body>
       </html>
     );
   }
   

3. Click Check under "Check the install" on your site's page in the dashboard (on first setup it's at the bottom of the install card). Added it through a tag manager? Use Check DNS (a TXT record) or Check file instead.

4. Mark a spot. Open the editor on your live page, click where a sponsor goes, pick a format (Banner, Card, Inline mention, Logo strip or Top bar) and set a monthly price.

5. Connect Stripe or Dodo, then share your booking page or add the "Advertise on {domain}" link to your footer.

Next.js notes

Why not next/script. next/script adds the tag from the browser after the page hydrates, so it isn't in the HTML your server sends, and verification reads that HTML. A plain <script async> in the layout is rendered on the server and stays in the page source.

Pages Router. Put the same tag inside <body> in pages/_document.tsx, after <NextScript />.

Hosting. The tag works the same on Vercel, Netlify or your own server.

Content Security Policy. If you send a CSP header, allow https://cdn.sponsor.st in script-src, or the browser blocks the script.

If Check can't find the script

• Added with next/script. The tag never reaches the server HTML; use a plain <script async>.
• In one page component. Put it in the root layout so every route has it.
• A preview URL. Check the production domain you added, after deploying.
• The script is in the source but spots don't show. Your CSP blocks it; add https://cdn.sponsor.st to script-src.

Removing it

Wait until running bookings have ended before deleting the tag. Removing it takes the script and its spots off your pages. If your site gets visits every day, a running booking logs downtime from the last time the script was seen; at the booking's end, those days become a refund due that you pay from your own Stripe or Dodo account. Pulling a booking early also leaves a refund due for its unused days.

A worked example

FAQ

Do spots appear after client-side navigation? Yes. Moving between pages with <Link> doesn't need a full reload for spots to show.

Will React warn about a raw script tag? No. A plain <script async> in a server component layout renders as normal HTML.

Does it work with a static export? Yes. The tag is plain HTML, so output: 'export' keeps it in every page.