Your AI employee goes live on your website with one line of code. Paste it once, and every page gets a chat bubble that answers visitors, day and night.
Before you start
- A published web experience using Chat bubble or Iframe embed. A web experience is your employee, packaged for your website.
- Access to edit your website, or someone who has it.
Steps
1. Copy your code
After you publish, Your web experience is live shows the Links and embed code. To find them again, open Deploy → Web & embeds and choose Get links and embed code on the experience's card. The Chat bubble script looks like this:
<script src="https://chat.aivah.ai/embed.js" data-aivah-id="YOUR_EXPERIENCE_ID" data-aivah-mode="bubble" data-aivah-route="bubble"></script>
An Embed code (iframe) starts with <iframe src="https://chat.aivah.ai/.... Experiences with voice also offer a Floating voice widget script. Always paste your own code: the ID connects it to your employee.
2. Add a chat bubble to every page
Paste the chat bubble code just before the closing </body> tag. Or paste it into your site builder's site-wide footer code setting. One paste covers every page that uses that footer.
3. Add an embed to one page
An embed puts your employee inside a section of one page. Paste the iframe code where you want your employee to appear. Use a full-width section with room for a conversation. It adjusts to phones and desktops automatically.
4. Follow the steps for your platform
WordPress
Chat bubble: install a header and footer code plugin, such as WPCode. Add your code to the site-wide footer and save.
Embed: edit the page and add a Custom HTML block where you want your employee. Paste the iframe code and choose Update.
On WordPress.com, plugins and custom code need a plan that supports them.
Webflow
Chat bubble: open Site settings → Custom code and paste your code into Footer code. Save, then publish your site.
Embed: drag a Code Embed element onto the page and paste the iframe code. Save and publish.
Wix
Chat bubble: open your site's Settings → Custom code and choose Add Custom Code. Paste your code and apply it to All pages. Place it in Body - end, then apply.
Embed: choose Add → Embed code → Embed HTML. Paste the iframe code and resize the frame on the page.
Wix runs custom code on sites with a premium plan and a connected domain.
Shopify
Chat bubble: open Online Store → Themes and choose Edit code on your theme. Open layout/theme.liquid, paste your code just before </body> and save.
Embed: choose Customize on your theme and add a Custom Liquid section to the page. Paste the iframe code and save.
Squarespace
Chat bubble: open Code injection. It's under Settings → Advanced, or Website → Pages → Custom code on newer sites. Paste your code into Footer and save.
Embed: add a Code block to the page, paste the iframe code and save.
Code injection needs a Squarespace plan that includes it.
Google Tag Manager
Chat bubble: open Tags → New, choose Custom HTML as the tag type and paste your code. Set the trigger to All Pages and save. Check it in Preview, then choose Submit to publish the container.
Use GTM for the chat bubble. Place iframe embeds directly in the page.
Any HTML site
Chat bubble: paste your code just before </body> in your site's shared footer template, or on every page.
Embed: paste the iframe code inside the section of the page where your employee should appear.
5. Check HTTPS, microphone and security settings
- Use HTTPS. Browsers only allow the microphone on secure pages, so voice needs your site on
https://. - Keep the iframe's
allowlist. It lets visitors use voice inside the frame. Their browser still asks before it turns on the microphone. - Content Security Policy. Your site may send a
Content-Security-Policyheader. If it does, addhttps://chat.aivah.aitoscript-src,frame-srcandconnect-src.
6. Built with Aivah Code?
In your Aivah Code project, choose Add an AI employee to your site instead. Pick the web experience and where it goes, and Aivah adds it for you. See Set up Environment and publish your app.
7. Test it like a visitor
Open your website in a private window, on a phone and on a laptop. Open the bubble and ask a question you know the answer to. Try voice if you turned it on, and send a test lead. The conversation appears in Insights → Chat history, and leads in Insights → Leads.
Good to know
Your website needs the Hobby plan or higher. When you update your employee, such as new knowledge or a new character, your website shows it straight away. You don't need to paste the code again.
Troubleshooting
- The bubble doesn't appear: check the code is on the page you're viewing and your site builder published the change. Then clear your browser or site cache.
- It works on one page but not others: the code is in a single page's settings. Move it to the site-wide footer.
- The browser console mentions Content Security Policy: add
https://chat.aivah.aito your policy as shown in step 5. - Voice won't start: check the page uses
https://and that the visitor allowed the microphone. - The embed is too small on phones: place it in a full-width section, and keep the
stylefrom the copied code. - The wrong employee answers: open the experience in Deploy → Web & embeds and check its Employee. Make sure you pasted that experience's code.
Next steps
Capture leads with consent, then watch Insights for what visitors ask.
Help Center