Create an agent in your Aioomi dashboard

Sign in at aioomi.com, go to the dashboard, and create a new agent. Give it a name, system prompt, and optionally attach a knowledge base.

Open agent settings and go to the Widget tab

Click on your agent, then navigate to the Settings tab. Open the Widget section where you can customize colors, position, and greeting message.

Copy the embed code snippet

You will see a ready-to-use script tag with your unique agent ID. Click the copy button to copy it to your clipboard.

Paste it before the closing </body> tag on your website

Open your website's HTML (or your CMS's custom code section) and paste the script tag just before the closing </body> tag. This ensures the widget loads after your page content.

Customize colors and position from the dashboard

Back in Aioomi, tweak accent color, header background, chat bubble color, and widget position (bottom-left or bottom-right). Changes apply instantly — no code updates needed.

Embed code example

Here is what the embed snippet looks like. Replace YOUR_AGENT_ID with your actual agent ID from the dashboard:

<script src="https://aioomi.com/widget.js" data-agent-id="YOUR_AGENT_ID"></script>

Place this tag just before </body> in your HTML. The widget loads asynchronously and will not slow down your page.

Platform notes

WordPress — Paste the script into your theme's footer via Appearance > Theme Editor, or use a plugin like “Insert Headers and Footers.”
Shopify — Go to Online Store > Themes > Edit Code > theme.liquid and paste before the closing </body> tag.
React / Next.js — Use a <Script> component with strategy="afterInteractive".
Static HTML — Paste the script directly into your HTML file before </body>.

Website Widget Setup