Widget Integration

Integrate the chatbot widget on your website with just a few lines of code.

This article is available in: Français

Install the Chatbot on Your Website

Connect your smart assistant to your website to start interacting with your visitors.

Introduction

This is the final and most rewarding step: making your chatbot visible to the whole world. Once installed, the widget (the small chat bubble) will appear on your pages, ready to answer your customers’ questions 24/7.

DoxyChat was designed to integrate on any website, regardless of the technology used. Go to the Integration tab of your dashboard to get started.

Option A: The Standard Method (Universal)

This is the classic method, compatible with 100% of websites. It consists of copying a small piece of code and pasting it into your site.

  1. In the Integration tab, locate the JavaScript Snippet area.
  2. Click the Copy Code button.
  3. Open your website’s source code (or your theme manager).
  4. Paste the code just before the closing </body> tag of your pages.
  5. Save and publish.

Did you know? This script is “asynchronous,” which means it will not slow down the loading of your website.

Option B: The “Magic Injection” (For HTML Files)

If you manage a simple static site and are not comfortable with code editing, we have created a magic tool for you.

  1. In the Integration tab, locate the Magic Injection area.
  2. Take your index.html file from your computer.
  3. Drag and drop it into the dotted area.
  4. DoxyChat analyzes your file, inserts the chatbot code in the right place, and automatically downloads the new version to your computer.
  5. All you have left to do is upload this new file to your hosting provider.

Option C: CMS Guides (WordPress, Shopify, Wix)

If you use a content management system (CMS), you do not need to touch the source code. Here is how to do it for the most popular ones:

Integration on WordPress

The easiest way is to use a free plugin to insert code.

  1. Install the “WPCode” plugin (or “Insert Headers and Footers”).
  2. Go to the Code Snippets > Header & Footer menu.
  3. Paste the DoxyChat code in the Footer section.
  4. Save.

Integration on Shopify

  1. Go to Online Store > Themes.
  2. Click on the three small dots ... next to your current theme, then Edit code.
  3. Open the theme.liquid file (in the “Layout” folder).
  4. Scroll all the way down the file until you find the </body> tag.
  5. Paste the DoxyChat code just before this line.
  6. Click on Save.

Integration on Wix

  1. Go to Settings > Custom Code (in the “Advanced” section).
  2. Click on + Add Custom Code.
  3. Paste the DoxyChat code into the text box.
  4. Name it “DoxyChat Widget”.
  5. Select Add Code to Pages: All Pages.
  6. Place the code in: Body - end.
  7. Click on Apply.

Verify the Installation

To ensure everything is working:

  1. Open your website in a new tab (preferably in private browsing to avoid cache).
  2. The chat bubble should appear at the location you configured (bottom right by default).
  3. Click on it and send a “Hello” to test the response!