Integration Overview
Choose the method that fits your stack. The main tradeoff is SEO fidelity: server-side methods render schemas into the HTML source; client-side methods inject them after JavaScript runs.Comparison
| Method | Schemas in HTML source | Works without JS | Auto-detected | Recommended for |
|---|---|---|---|---|
| Next.js SDK | ✅ Yes | ✅ Yes | ✅ On next scan | Next.js App Router |
| Astro | ✅ Yes | ✅ Yes | ✅ On next scan | Astro sites |
| Nuxt | ✅ Yes | ✅ Yes | ✅ On next scan | Nuxt / Vue SSR |
| Custom API | ✅ Yes | ✅ Yes | ⚠️ With marker | Any SSR backend |
| CDN script | ❌ Client-injected | ❌ No | ✅ Dashboard poll | Quick setup, any site |
| Inline script | ❌ Client-injected | ❌ No | ✅ Dashboard poll | Legacy / static sites |
| GTM | ❌ Client-injected | ❌ No | ❌ Manual confirm | Non-technical teams |
Custom API auto-detection requires adding
data-instantschema="1" to each rendered <script type="application/ld+json"> tag. Without that attribute, the dashboard cannot distinguish your schemas from other JSON-LD on the page and manual confirmation is required.How detection works
InstantSchema detects integration by scanning your homepage’s HTML source (no JavaScript is executed):- npm / SDK — looks for
data-instantschema="1"on any<script type="application/ld+json">tag - CDN script — looks for
/v1/loader.js+data-project-id="YOUR_PROJECT_ID"in a script tag - Inline script — looks for the fetch call to
/api/v1/structured-data?project=YOUR_PROJECT_ID - GTM — not detectable from HTML; requires manual “Mark as active” in the dashboard