Add a Voice AI Agent to a Netlify Site (Snippet Injection)
Add the AnveVoice voice agent to a Netlify site with Snippet Injection under Post processing: no redeploy, but not on SSR, proxied or function routes.
How to add AnveVoice to a site hosted on Netlify
Netlify can inject the AnveVoice tag into your pages at serve time under Project configuration, Developer settings, Post processing, Snippet injection. It takes effect immediately with no redeploy, but it skips proxied content and server-rendered pages. Steps checked against the official documentation on 2026-10-14.
At a glance
- Where the code goes: Project configuration → Developer settings → Post processing → Snippet injection → Add Snippet
- Placement: Before the closing </head> tag or before the closing </body> tag
- Redeploy: None; the snippet is injected when pages are served
- Does not apply to: Proxied content, function-handled routes and SSR pages
Is Snippet Injection the right route?
Netlify hosts the site, but the page HTML usually comes from your own project: a static build, a Next.js, Astro or Hugo site, or a hand-written HTML folder. If you can edit that project, putting the AnveVoice tag in the source (see the install guide for your framework) is the most predictable approach and travels with the code. Snippet injection is useful when you cannot or do not want to change the repository, or when the same tag must be added to several deploy contexts quickly. You need your embed ID from app.anvevoice.app. The Free plan is $0 with no card. Netlify's snippet page does not state a plan restriction for the feature, so look for the Post processing section in your own project settings.
Add the snippet
- 1. Open the project settings — In the Netlify app, open your project and go to Project configuration → Developer settings. Netlify's older guides call this area Build & deploy, so look there if you do not see Developer settings.
- 2. Find Post processing — Scroll to the Post processing section and find Snippet injection.
- 3. Add a snippet — Click Add Snippet. Give it a name such as AnveVoice.
- 4. Paste the tag and choose placement — Paste the tag below as the snippet body. Netlify lets you pick between injecting before the closing head tag or before the closing body tag; before the closing body tag is a natural fit. Code: <script src="https://anvevoice.app/embed.js?embedId=YOUR_EMBED_ID" async></script>
- 5. Save — Save the snippet. Netlify says it is injected immediately and no redeploy is necessary.
Where injection works and where it does not
Netlify explains that snippets are injected when a page is served, not when the site is built, and that the feature is designed for static HTML. Three cases fall outside it:
- Proxied content: if a path is proxied to another service, that service must return the complete HTML itself, including the AnveVoice tag.
- Function-handled routes: if a route is handled by a Netlify Function, snippets are not injected.
- Server-rendered pages: because SSR on Netlify runs on Netlify Functions, snippets are not injected on SSR pages. For a framework app with SSR, add the tag in the framework (the Next.js, Nuxt or SvelteKit guides) instead.
Previews, branches and password protection
A snippet applies to the project as served, so deploy previews and branch deploys of static sites show the voice agent too, and the same embed ID will be used. If you do not want preview deploys to count towards usage or appear in your agent's activity, wrap the tag in Netlify's Liquid conditions on the CONTEXT variable, which Netlify documents for snippets, so the script only renders on production. Netlify also states that injected snippets appear on the password protection screen. That is handy for testing: you can confirm the script loads before you remove the password.
Check that it works
- 1. Open the live URL in a private window — Use your Netlify subdomain or custom domain.
- 2. Look for the microphone button — It appears bottom-right by default. Click it, allow microphone access and ask a question about the site.
- 3. View the page source — Search the served HTML for anvevoice.app/embed.js. If it is missing, the route is probably a function, proxy or SSR page.
Common problems
- Snippet saved but missing on a page: that page is SSR, proxied or handled by a function. Add the tag in the app's code instead.
- Button appears twice: the tag is also in the site source. Keep one copy.
- Variables not available in the snippet: custom environment variables need the Post processing scope to be read by snippets.
- Microphone blocked: Netlify serves HTTPS by default; check the custom domain certificate if the browser reports an insecure page.
Sources
- Netlify Docs: Snippet injection (https://docs.netlify.com/build/post-processing/snippet-injection/) — checked 2026-10-14
- Netlify Blog: How to add features to your site via snippet injection (https://www.netlify.com/blog/2021/12/20/how-to-add-features-to-your-site-via-snippet-injection/) — checked 2026-10-14
Related
- How to add AnveVoice to a plain HTML website
- How to add AnveVoice to a Next.js app
- How to add AnveVoice to an Astro site
- How to add AnveVoice using Google Tag Manager
Try AnveVoice on your site
Free plan: $0, 50,000 tokens a month, no card. Get your embed ID in the dashboard, then paste one tag.