Add a Voice AI Agent to a Softr App (2026 Guide)

AnveVoice

Add a Voice AI Agent to a Softr App (2026 Guide)

Add the AnveVoice voice agent to a Softr app with Settings → Custom Code, or page-level custom code, including plan limits and single-page-app behaviour.

How to add AnveVoice to a Softr app

Softr gives you app-level custom code in Settings, where the footer field runs before the closing body tag, and page-level custom code in Page Settings. Paste the AnveVoice tag into the app-level footer, save and publish. Softr apps can behave as single-page apps, which changes how scripts load. Steps checked against the official documentation on 2026-10-14.

At a glance

Where the code goes: Settings → Custom Code → footer field (app-wide), or Page Settings → Custom Code (one page)
Coding needed: None; paste one script tag, save, publish
Plan limits: Softr's docs say the Custom code block needs a paid plan (Pro and above); the app-level fields are not given a plan in the pages we read
Time: About 2 minutes

Before you start

Softr builds web apps and portals on top of data sources such as Airtable or Softr's own database. The AnveVoice agent answers questions about the content of your site pages, so decide which of those pages should carry it: usually all public pages. Get your embed ID from app.anvevoice.app. The AnveVoice Free plan needs no card. On the Softr side, check your workspace plan before you begin, because Softr's code features are plan-tiered.

1. Copy the tag — This line is the full install. Replace YOUR_EMBED_ID with the ID from your AnveVoice dashboard; &position=bottom-left or &theme=dark can be appended to the URL. Code: <script src="https://anvevoice.app/embed.js?embedId=YOUR_EMBED_ID" async></script>

Plan limits on Softr

Softr's documentation page "Custom Code Block Overview" states in two places that custom code is available on the Pro plan and above, and that you need a paid plan to use the Custom code block. That note is about the block that you drag into a page. The documentation for Settings → Custom Code and for Page Settings describes the header and footer fields without naming a plan, so we cannot promise they work on every tier. Practical advice: open your app's Settings and look for the Custom Code section. If it is there and saves, use it. If Softr prompts you to upgrade, that confirms the plan gate; compare Softr's current pricing page before choosing a tier. Softr's pricing and plans page describes Free, Basic, Pro and Business self-serve plans plus a custom Enterprise plan.

Method 1: app-level footer code (recommended)

Softr's General Settings documentation says the app-level Custom Code section has two parts: the first is applied before the closing head tag, the second before the closing body tag, and the second is meant for scripts. The AnveVoice tag belongs in the second field.

1. Open the app's Settings — In the Softr Studio, open your app and click Settings.
2. Find Custom Code — Scroll to the Custom Code section in General settings. You will see the header field and the footer field.
3. Paste into the footer field — Insert the AnveVoice script tag into the footer code box, and keep any existing snippets above or below it untouched.
4. Save and publish — Click Save, then publish the app. Softr's own use-case instructions end with the reminder not to forget to publish.

Method 2: page-level code

Page Settings has a Custom Code section where you can add HTML, CSS and vanilla JavaScript to the header or footer of the current page only. Use it if the voice agent should appear on a pricing page and nowhere else. The steps are the same: open the page, open its Page Settings, paste the tag into the footer field, save and publish. Do not use the Custom code block (Blocks → Static → Custom code) for this. It inserts code at a visual position in the page body and is designed for embedded widgets like a Calendly inline form, and it requires a paid plan.

Single-page-app mode: the gotcha

Softr's SPA guidelines say that in SPA mode there are no full page reloads. Scripts in the app header and footer custom code run once, on the first page load, and do not run again when visitors move between pages. For AnveVoice that is a good thing: the voice button is created once and persists as visitors navigate, rather than being re-created on every click. The same guidelines say to keep page-specific code out of app-level custom code. That is the reason to avoid page-level copies of the same tag; with SPA navigation, a page-level script can survive or clash with other pages. Use one app-level entry.

Check that it works

1. Open the published app URL — Use the subdomain or custom domain of your live app in a private window. Softr's Preview is useful, but verify on the published address.
2. Navigate between pages — Click through two or three pages. The button should stay in place if SPA mode is on.
3. Test the microphone — Click the button, allow microphone access, and ask a question. HTTPS is required.

Common problems on Softr

No Custom Code option: check your plan. Softr says custom code needs a paid plan.
Works in Preview, not live: the app was not republished after you saved the code.
Invalid markup in the head: A Softr community thread warns against putting full HTML documents or div elements in the head field. The AnveVoice tag is a script tag and belongs in the footer.
Logged-in pages only: if you add the tag to a page that is restricted by user group, visitors who cannot see the page never load it.
Two microphone buttons: the tag exists at app level and again on a page. Remove the page-level copy.

Sources

Softr Docs: Custom Code Block Overview (https://docs.softr.io/custom-code/custom-code-block-overview) — checked 2026-10-14
Softr Docs: General Settings (Custom Code section) (https://docs.softr.io/application-settings/general-settings) — checked 2026-10-14
Softr Docs: Page Settings (https://docs.softr.io/application-settings/page-settings) — checked 2026-10-14
Softr Docs: SPA Custom Code Guidelines (https://docs.softr.io/custom-code/spa-custom-code-guidelines) — checked 2026-10-14
Softr Docs: Pricing and Plans (https://docs.softr.io/workspace-and-billing/pricing-and-plans) — checked 2026-10-14

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.