Skip to main content

Enable Live Chat on Your Webflow Sites

Webflow is a common tool used to build professional, responsive, and custom websites in a completely visual canvas with no code. And In this article, you will learn how to install Chative.IO live chat into your Webflow site in a few steps.

First, you will need to customize your live chat settings, And then install Chative.IO live chat into your Webflow. There are two ways you can do that:

  • Install Chative.IO live chat on all pages
  • Install Chative.IO live chat on a specific page

Install Chative.IO live chat on all pages​

Once you have customized your live chat channel, follow these steps to install it:

Step 1: Go to Chative.IO system and copy the live chat code that you want to install by going to Channels > Choose the channel >Installation.

Step 2: Fill in the Webflow URL in the Website and copy the live chat code in the Copy code.

Step 3: Click the Save for the changes to be applied.

Install livechat to Website!

Step 4: Go to your project in Webflow, in the Project Settings site, open Custom Code.

Step 5: Scroll down the Header Code or Footer Code section and insert your live chat code.

Step 6: Click on Save Changes, then go to Publish> Choose the domain you publish your live chat on > Click on Publish to Selected Domains.

Add code in the Footer code section

Install Chative.IO live chat on a specific page​

Besides installing the live chat on all web pages, you can also install it on a specific page such as live chat specific for pricing page, technical support page, blog page,...

Once you have defined the page you want to have live chat, please follow the steps below to do this setup:

Step 1: Go to Chative.IO system and copy the live chat code that you want to install by going to Channels > Choose the channel > Installation.

Step 2: Fill in the Webflow URL in the Website and copy the live chat code in the Copy code section.

Step 3: Click the Save for the changes to be applied.

Install livechat to Website!

Step 4: On the Webflow interface, click the Pages site on the top of the screen.

Step 5: Choose the page you want to publish your live chat on and open its settings.

Step 6: Scroll down to the Custom Code, then insert live chat code copied from Chative.IO.

Step 7: Click on Save to finish and enjoy the result.

Step 8: Go to Publish > Choose the domain you publish your live chat on > Click on Publish to Selected Domains.

Custom code in Webflow

Next, let's start to chat with your customers through our inbox and collaborate with your teammate in it.