How To Install The ChatBot on Your Webflow Website

Quickly integrate Botgenuity ChatBot with your Webflow website using this easy step-by-step guide to improve customer service.

Getting Started

Elevate your website's interactivity and user engagement by seamlessly integrating an AI-powered ChatBot from Botgenuity into your Webflow project. Follow these simple steps to enhance your site with cutting-edge conversational AI.

Step 1: Log in to Your Webflow Dashboard

Start by accessing your Webflow dashboard. You can do this by visiting Webflow's login page. Enter your credentials (email and password) to proceed.

Step 2: Select Your Project

Once logged in, you'll be greeted with a list of your Webflow projects. Identify and click on the project you wish to augment with the ChatBot.

Step 3: Access Project Settings

With your project open, locate the "Project settings" option on the top navigation bar and click on it.

Step 4: Navigate to Custom Code

In your project settings, find the "Custom code" tab on the left sidebar and select it. This area allows you to add code that will affect your entire site.

Step 5: Embed Your ChatBot Code

In the "Head code" section, you're going to paste the ChatBot embed code provided by Botgenuity. It should resemble the following snippet:

<script
  type="module"
  src="https://chat.botgenuity.com/api/embed?id=your-bot-id-here"
  crossorigin="anonymous"
></script>

Placing the code in this section ensures the ChatBot will load in the <head> of every page on your site, providing a consistent experience for your visitors.

Step 6: Save and Publish Your Changes

After inserting your ChatBot code, click the "Save changes" button located at the bottom of the page. To apply these changes to your live site, return to the Webflow Designer by clicking the "Designer" button at the top left, and then publish your site using the "Publish" button on the top right corner.

Step 7: Verify the ChatBot on Your Site

To confirm the ChatBot's successful integration, open your published Webflow site in a new browser tab. The ChatBot should now be operational on your site. For assurance, right-click on the page, select "View Page Source," and search for the embed code to verify its presence.

Note: It's important to ensure that adding custom code does not disrupt other elements or functionalities of your site. Should any issues arise post-implementation, revisit the code for potential errors or contact Botgenuity support for further assistance.

Congratulations! Your Webflow site is now empowered with a state-of-the-art AI ChatBot, ready to engage and assist your visitors 24/7.

Squarespace GoDaddy