1. Overview
  2. Multi-Channel Widget
  3. Installing a multi-channel widget

Installing a multi-channel widget

Each widget can be installed on the website either as a multichannel button or as a standalone live chat widget.
Just select the appropriate code snippet to copy and install on your website.
 

To install a multi-channel widget on your website, please follow these steps:

  1. Navigate to the Widgets Section: Start by accessing the 'Widgets' area within your platform or account dashboard. This section contains all the available widgets that you can add to your website.
  2. Select Your Desired Widget: Browse through the list of widgets and choose the one you want to install. Ensure it aligns with the functionality you wish to introduce to your site.
  3. Access the Widget Script Code: Click on the 'Widget Script Code' button associated with your selected widget. This action will generate the specific code needed for integration.
  4. Copy the Widget Code: Once the script code appears, copy it to your clipboard. This will prepare you for the insertion process into your website's code.
  5. Open Your Website's Source Code: Use your preferred code editor or access your website through your hosting provider's web builder or Content Management System (CMS). This is where you'll add the widget code.
  6. Insert the Widget Code: Locate the closing </body> tag in your website's HTML source code. Paste the copied widget script code just before this closing tag. Placing it here ensures the widget loads correctly without affecting the rest of your site's content.
  7. Save Your Changes: After inserting the code, save the changes you've made to your website's source code. This will update your website with the new widget.
  8. Verify the Installation: Finally, visit your website to confirm that the widget appears and functions as expected. This step ensures that the installation was successful and allows you to see the widget in action.

 

Some general Guidelines:

To install chatbot widgets on websites, there are several standard methods you can use depending on the platform you're working with. Typically, these methods include embedding a script, using a plugin, or integrating via API. Here's an overview of the general ways and how you can do this on specific website builders like Sitejet, Wix, Shopify, and WordPress via the script:

Using a Widget Script (Common Method)

  • Step 1: Most chatbot platforms provide a script that you embed into the <head> or <body> section of your website.
  • Step 2: Copy the provided script from your chatbot service.
  • Step 3: Paste the script into the HTML code of your site or into a custom code section in the website builder.
  • Step 4: Save and publish.

Examples for Specific Platforms:

Sitejet

Sitejet allows you to integrate a chatbot by adding a custom code section.

  • How to Add a Chatbot Widget:
    • Go to your Sitejet dashboard.
    • Navigate to Settings > Code > Custom JavaScript.
    • Paste the chatbot's script in the Custom JavaScript box.
    • Click Save and Publish to make it live on your website.
Wix

Wix provides an easy way to integrate chatbots using custom code.

  • How to Add a Chatbot Widget:
    • Open your Wix website editor.
    • Go to Settings > Tracking & Analytics.
    • Click on + New Tool > Custom and paste the chatbot script into the code box.
    • Save and publish.
Shopify

Shopify allows adding chatbot widgets using custom code.

  • How to Add a Chatbot Widget:
    • From your Shopify admin, go to Online Store > Themes > Actions > Edit Code.
    • In the Layout section, open theme.liquid (or footer.liquid if you prefer to place the code at the bottom of the page).
    • Paste the chatbot script just before the closing </body> tag.
    • Save the changes and check your website for the widget.
WordPress

You can manually add the script using the custom HTML editor.

  • How to Add a Chatbot Widget (via custom code):

    • From the WordPress dashboard, go to Appearance > Theme Editor.
    • Open the footer.php or header.php file (depending on where you want the widget to appear).
    • Paste the chatbot script just before the closing </body> tag.
    • Save the file, and your chatbot will be added.

 

Additional Tips for Customising the Chatbot Widget:

  1. Placement: Depending on the platform, you can usually choose to place the chatbot widget in the footer, header, or as a floating element that appears on the right or left side of the screen.
  2. Customisation: Some platforms and widgets allow you to customise the appearance, colour, and messaging of the chatbot directly through the settings.
  3. Testing: Always test the chatbot after installation to ensure it's working correctly across different devices and browsers.

Related Articles

Written by Ken
Was this article helpful?