Website widget. Your agent on every page of your site.
Style the chat window to match your brand, then add it to your website with one snippet, the WordPress plugin, the Shopify app embed or Google Tag Manager.
Style the widget
Open Deploy → Widget. Changes save automatically and the preview beside the settings shows exactly what visitors will see. Settings are grouped in three tabs:
| Tab | Settings |
|---|---|
| Layout | Chat window (a launcher that opens a window) or Ask bar (an inline message bar with a see-through panel); launcher shape (Circle, Pill, Bar) and text; message and header style; font; position (bottom right or left); corners. Under Advanced: header and launcher icons or your own image (PNG, JPG, SVG or WebP under 512 KB), font size and animations. |
| Brand | One of 10 themes, light or dark appearance, primary colour, visitor message colour, solid or gradient header, and advanced colours. |
| Content | Open automatically after 1 to 10 seconds for new visitors, Proactive messages (shows your first two starters above the closed launcher) and a reply Sound (off by default). The greeting, starters, reply feedback and page links are set in Optimize. |
On phones the chat opens full screen.
Add it to your website
Choose Go live (or Install code) on the Widget page and pick your platform. The panel shows the code to copy and where to paste it.
| Platform | How |
|---|---|
| HTML site, Squarespace, Wix, Webflow | Copy the snippet and paste it before the closing </body> tag, or in the site-wide footer code. |
| WordPress | Download the plugin, then Plugins → Add New → Upload Plugin → Install Now → Activate. Open Settings → SimplyBoost Chat, paste your Bot ID and save. No plugin? Paste the snippet with WPCode as a site-wide footer snippet. |
| Shopify | With your store connected to SimplyBoost, no code is needed: open the theme editor, switch on SimplyBoost Chat under App embeds and save. Without the connection, paste the Liquid code into layout/theme.liquid. |
| Google Tag Manager | New tag → Custom HTML → paste the snippet → trigger All Pages → Submit and publish. |
| React, Next.js, Vue / Nuxt | Copy the component the panel shows into your app's layout. |
<script>
window._CHATBOT_CONFIG_ = {
chat_bot_id: "YOUR_BOT_ID"
};
</script>
<script>
(function(d, s, id) {
if (d.getElementById(id)) return;
var js = d.createElement(s); js.id = id;
js.src = "https://get.simplyboost.io/widget.js?v=" + Date.now();
js.async = true;
d.head.appendChild(js);
})(document, 'script', 'simplyboost-classic-script');
</script>Copy the exact snippet from the Go live panel: it already contains your agent's ID. Open your site once afterwards; the panel then shows Live on yourshop.com and when the widget was last seen. If it has not been seen for a week, the panel warns you.
To show the chat only to signed-in customers, or to let the agent recognise them, see Verified visitors.
What visitors see
- The agent's name with an Online indicator, your greeting and conversation starters.
- Replies that appear word by word, with suggested follow-up questions as chips under the latest reply.
- Thumbs up and down under each reply (when Reply feedback is on).
- A menu to expand the window and download the transcript, and a button to clear the chat.
- Product cards with Add to cart and Go to checkout, when your Shopify store is connected.
- "Connecting you to a human agent" and "Sanne joined the chat" when your team takes over.
Replies follow the visitor's language (or your fixed language); the widget's own buttons are in English. When your plan has paused replies, visitors see a short neutral message.