Chatspark
⌘K
⌘K

Deploying Your Agent

Once your agent is trained, you can deploy it to your website or any of the messaging channels ChatSpark supports. Choose the channel your customers use most.

8 min read

Updated September 2026

Choose Your Channel

Each AI agent is deployed to one channel. When creating an agent, select the AI Agent Type in the Settings tab to choose where it lives. The rest of this page covers the Website type. For all other channels, follow the dedicated setup guide below.

ChannelBest ForSetup Guide
WebsiteWebsite visitors, lead captureThis page
WhatsAppMobile-first markets, global reachWhatsApp setup guide
Facebook MessengerFacebook Page inbox, social media presenceFacebook Messenger setup guide
Instagram DMsE-commerce, visual brandsInstagram DMs setup guide
TelegramTech-savvy audiences, developer communitiesTelegram setup guide
SlackInternal teams, B2B supportSlack setup guide
DiscordCommunity servers, developer audiencesDiscord setup guide
One Agent Per Channel
Each agent is assigned to a single channel. To cover multiple channels, create a separate agent for each one. They can share the same training data. WhatsApp, Facebook, Instagram, Telegram, Slack, and Discord require a Pro or Enterprise plan.

Website Widget

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.

Finding Your Agent ID
Go to AI Agents, click on your agent, then click the code icon. Your Agent ID is shown at the top of the embed panel.

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>
Launcher Style Attribute
Supported values: bubble (default) and conversation_bar. When using the Conversation Bar, the widget is centered at the bottom of the page and the iframe only occupies the space the bar visually covers — it does not block page content underneath.

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
Get the Plugin
The plugin is available at wordpress.org/plugins/chatspark.

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
Note
Code injection is available on Business and Commerce plans in Squarespace.

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>
Learn More
See the full AI Agent Triggers documentation for automatic triggers, scroll-based triggers, and the JavaScript API.

Previous

Training Your Agent

Next

WhatsApp