Documentation Index
Fetch the complete documentation index at: https://docs.thrads.ai/llms.txt
Use this file to discover all available pages before exploring further.
For Human
Get your staging publisher ID
Sign up and copy your staging PUBLISHER_ID from the dashboard. Add the SDK script tag
Load the SDK script synchronously. HTML
Next.js App Router
Next.js Pages Router
React (Vite)
Edit index.html:<head>
<script src="https://sdk.thrad.ai/sdk.js?token=YOUR_PUBLISHER_ID"></script>
</head>
Available in Next.js v13+. Edit app/layout.tsx:import Script from 'next/script'
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html>
<head>
<Script
src="https://sdk.thrad.ai/sdk.js?token=YOUR_PUBLISHER_ID"
strategy="beforeInteractive"
/>
</head>
<body>{children}</body>
</html>
)
}
Available in Next.js v13 and earlier. Edit pages/_document.tsx:import { Html, Head, Main, NextScript } from 'next/document'
export default function Document() {
return (
<Html>
<Head>
<script src="https://sdk.thrad.ai/sdk.js?token=YOUR_PUBLISHER_ID" />
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
)
}
Edit index.html:<head>
<script src="https://sdk.thrad.ai/sdk.js?token=YOUR_PUBLISHER_ID"></script>
</head>
Add a contextual ad under the AI response
Contextual ads fire after your AI responds, matched to the conversation content. Call thrad.render() once you have the AI’s response.<div data-thrad-type="contextual" data-thrad-format="message"></div>
<script>
async function onAIResponse(userMessage, aiResponse) {
await thrad.render({ query: userMessage, response: aiResponse })
}
</script>
import { useRef } from 'react'
declare const thrad: { render: (opts: { query: string; response: string }) => Promise<void> }
export default function ChatResponse() {
async function onAIResponse(userMessage: string, aiResponse: string) {
await thrad.render({ query: userMessage, response: aiResponse })
}
return (
<div>
{/* Contextual ad — place near the AI response area */}
<div data-thrad-type="contextual" data-thrad-format="message" />
</div>
)
}
For Agent
Get your staging publisher ID
Sign up and copy your staging PUBLISHER_ID from the dashboard. Paste this prompt into your coding agent
Copy into Cursor, GitHub Copilot, Claude Code, or any LLM-powered editor.Integrates the Thrad SDK with framework-aware instructions
What’s next
Integration cases
All placement patterns — opener only, contextual, SPA routing, multiple slots
Themes & identity
Customize colors, dark mode, and pass user identity for better ad matching
