Vercel & Netlify
Finding your Site ID
Log in at dash.botfighter.dev → your Site ID is shown at the top of the dashboard.
Next.js (Vercel or Netlify)
Use next/script with strategy="afterInteractive" so the snippet loads after hydration without blocking the page:
tsx
// pages/_app.tsx (or app/layout.tsx for the App Router)
import Script from 'next/script'
export default function App({ Component, pageProps }) {
return (
<>
<Component {...pageProps} />
<Script
src="https://botfighter.dev/botfighter.js"
data-site="YOUR-SITE-ID"
data-api="https://api.botfighter.dev"
data-honeypot="true"
strategy="afterInteractive"
/>
</>
)
}For the App Router (app/layout.tsx):
tsx
import Script from 'next/script'
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<body>
{children}
<Script
src="https://botfighter.dev/botfighter.js"
data-site="YOUR-SITE-ID"
data-api="https://api.botfighter.dev"
data-honeypot="true"
strategy="afterInteractive"
/>
</body>
</html>
)
}Static HTML on Vercel or Netlify
Paste the snippet before </body> in your HTML template:
html
<script
src="https://botfighter.dev/botfighter.js"
data-site="YOUR-SITE-ID"
data-api="https://api.botfighter.dev"
data-honeypot="true"
defer>
</script>Netlify Snippet Injection (no code changes needed)
Netlify can inject snippets into every page at build time without touching source files:
- In Netlify, go to Site Settings → Build & Deploy → Post processing → Snippet injection.
- Click Add snippet.
- Set Insert before to
</body>. - Paste the snippet and save.
- Trigger a new deploy — the snippet will appear on every page.
Need help? Open an issue on GitHub or check the dashboard for your live signal feed.