Deploying Your Agent

Standard Embed

To add ChatSpark to any website, copy your embed script and paste it into your site's HTML.

1. Go to AI Agents in the dashboard
2. Click the code icon on your agent
3. Enter the domain(s) where the widget will appear
4. Copy the embed script
5. Paste it just before the closing </body> tag on every page

The script looks like this:

<script
  src="https://chat.chatspark.io/loader.js"
  data-chatbot-id="YOUR_AGENT_ID"
></script>

Replace YOUR_AGENT_ID with the ID shown in your dashboard. Once the script is on the page, the chat widget appears automatically in the bottom-right corner.

Launcher Style

By default the widget appears as a floating bubble in the bottom-right corner (Classic Bubble). You can also choose the Conversation Bar — a centered input bar at the bottom of the page with an animated prompt that invites visitors into a conversation.

The launcher style is set in your agent's Settings tab and automatically applied to every visitor. You can also override it per-embed using the data-launcher-style attribute:

<!-- Classic Bubble (default) -->
<script
  src="https://chat.chatspark.io/loader.js"
  data-chatbot-id="YOUR_AGENT_ID"
></script>

<!-- Conversation Bar -->
<script
  src="https://chat.chatspark.io/loader.js"
  data-chatbot-id="YOUR_AGENT_ID"
  data-launcher-style="conversation_bar"
></script>

WordPress

The official ChatSpark plugin is the easiest way to add your agent to a WordPress site. It handles the embed automatically across all pages.

1. In your WordPress admin, go to Plugins and click Add New
2. Search for ChatSpark
3. Install and activate the plugin
4. Go to WordPress Admin and click ChatSpark in the sidebar
5. Paste your Agent ID into the AI Agent ID field and save

Shopify

You can add the embed script to a Shopify store through the theme editor.

1. In your Shopify admin, go to Online Store and click Themes
2. Click Actions next to your active theme and select Edit code
3. Open theme.liquid under the Layout folder
4. Paste your embed script just before </body>
5. Click Save

Wix

Wix supports custom code through its site settings.

1. Open the Wix Editor and go to Settings
2. Click Custom Code under Advanced
3. Click Add Custom Code
4. Paste your embed script, set the location to Body - end, and apply it to all pages
5. Click Apply and publish your site

Squarespace

Squarespace lets you inject custom code through the website settings panel.

1. Go to Settings and click Advanced
2. Click Code Injection
3. Paste your embed script into the Footer field
4. Click Save

Webflow

In Webflow, custom scripts are added through the project settings.

1. Open your project and go to Project Settings
2. Click the Custom Code tab
3. Paste your embed script into the Footer Code field
4. Click Save Changes and publish your site

Trigger from Custom Elements

You can open the chat widget from any button, link, or element on your page. Add two attributes to any HTML element:

• class="cs-trigger-agent" tells ChatSpark the element should open the widget
• data-trigger="Your message here" pre-fills the chat with specific text

<button class="cs-trigger-agent" data-trigger="Talk to Sales">
  Contact Sales
</button>

<a href="#" class="cs-trigger-agent" data-trigger="I need help with pricing">
  Pricing Questions?
</a>