Before you start
When you sign up, IngridAI emails you a short snippet of code. Have that email open before you begin. A few things to know about it:
- It contains values unique to your firm, so copy it exactly — every character. A single missing piece will stop it from loading.
- You only install it once. The chat bubble then appears on every page automatically; you don't add it page by page.
- It belongs at the end of the page body, just before the
</body>tag, so your content loads first and the bubble follows a moment later. Most platforms have a "Footer" or "Body — end" area that handles this for you — each section below tells you which applies.
Raw HTML / JavaScript
For developers — use this if you or a developer edit the site's HTML directly.
- Open the shared template every page uses (e.g.
index.html, or a base layout file). - Find the closing
</body>tag near the bottom. - Paste your snippet on a new line just before
</body>:
<!-- Paste your IngridAI snippet here, just before </body> -->
</body>
- Save and deploy, then open your live site. The chat bubble appears in the bottom-right corner.
Adding the snippet to the shared template makes it appear site-wide. Added to a single page, it appears only there.
Wix
Use this if your site was built with Wix.
Your site must be published with a connected domain — Custom Code doesn't run on the free wixsite.com preview address.
- Open your Wix dashboard and select the site.
- Click Settings, then Custom Code (under Development & integrations).
- Click + Add Custom Code, and paste your snippet into the code box.
- Name it something like
IngridAI Widget. - Under Add Code to Pages, choose All pages.
- Under Place Code in, select Body — end. (This places it before
</body>for you.) - Click Apply, then check your live site.
Squarespace
Use this if your site was built on Squarespace.
Code Injection requires a paid plan (Business or higher; newer accounts may see names like "Core" or "Plus"). It isn't available on the Personal plan — if you don't see it, that's why.
- Log in and open your site.
- Click Settings → Advanced → Code Injection.
- Paste your snippet into the Footer box. (The Footer field loads code before
</body>on every page.) - Click Save.
- Check your live site in a private/incognito window; changes take a minute or two to appear.
Heads up: closing the panel without clicking Save discards your code — a common slip.
WordPress
Use this if your site runs on WordPress.
Two kinds of WordPress: self-hosted WordPress.org sites, and WordPress.com sites on a Business plan or higher, can install plugins. Lower WordPress.com plans can't — contact whoever hosts your site.
Easiest method — no code editing:
- Go to Plugins → Add New Plugin and search WPCode.
- Install and activate "WPCode – Insert Headers and Footers + Custom Code Snippets."
- In the left menu, go to Code Snippets → Header & Footer.
- Paste your snippet into the Footer box. (This loads before
</body>site-wide.) - Click Save Changes, then check your live site.
Developer alternative: add the snippet via a child theme's functions.php on the wp_footer hook (priority 100). Use a child theme, or a theme update will erase it.
Shopify
Use this if your site runs on Shopify.
Duplicate your theme first, so you have a safe backup to revert to.
- Go to Online Store → Themes.
- Next to your theme, click the ··· button → Duplicate (your backup), then ··· → Edit code.
- In the left sidebar, open the Layout folder and click theme.liquid.
- Scroll to the bottom, find the closing
</body>tag, and paste your snippet just before it:
<!-- Paste your IngridAI snippet here, just before </body> -->
</body>
- Click Save, preview the theme, and publish when it looks right.
Confirming it worked
Open your live site (not the editor preview), wait a second for it to load, and look for the chat bubble in the bottom-right corner. Click it and send a test message.
If the bubble doesn't appear:
- Double-check the values in your snippet match the onboarding email exactly.
- Make sure you saved or published after pasting (the most common issue).
- Clear your browser cache, or try a private/incognito window.
- Check nothing was altered when pasting — smart quotes or a missing
</script>will break it. - On Wix/Squarespace, confirm the site is published and (Squarespace) your plan includes Code Injection.
Still stuck? Email info@ingridai.co with the name of your platform, and we'll help you troubleshoot.
Quick reference
| Platform | Where to paste | Placement before </body> |
|---|---|---|
| Raw HTML/JS | Before </body> in your template | Manual |
| Wix | Settings → Custom Code → Body — end | Automatic |
| Squarespace | Settings → Advanced → Code Injection → Footer | Automatic |
| WordPress | WPCode plugin → Header & Footer → Footer | Automatic |
| Shopify | Online Store → Themes → Edit code → theme.liquid | Manual |