{"id":13103,"date":"2023-01-21T09:06:09","date_gmt":"2023-01-21T09:06:09","guid":{"rendered":"https:\/\/www.kommunicate.io\/blog\/?p=13103"},"modified":"2025-01-17T10:29:07","modified_gmt":"2025-01-17T10:29:07","slug":"add-a-chatbot-to-webflow","status":"publish","type":"post","link":"https:\/\/www.kommunicate.io\/blog\/add-a-chatbot-to-webflow\/","title":{"rendered":"How to Add a Chatbot in Webflow with No Code"},"content":{"rendered":"\n
\"Illustration<\/figure>\n\n\n\n

What is Webflow<\/strong>?<\/h2>\n\n\n\n

Webflow is a cloud-based CMS that helps to build great websites. Webflow allows users to design, build and host a website with simple and easy steps.<\/p>\n\n\n\n

In this blog, we are building a website and adding a chatbot so that website visitors can take help from the chatbot to understand the product.<\/p>\n\n\n

\n
\"Text<\/a><\/figure>\n<\/div>\n\n\n

How to integrate Chatbot Chat Widget in Webflow Site<\/h2>\n\n\n\n

Sign up on Webflow CMS <\/a>and design your website. Once you finish designing, follow the given steps to add the Kommunicate chat widget to your website.<\/p>\n\n\n\n

    \n
  1. Log into your Webflow account and open your site in design mode.
    <\/li>\n<\/ol>\n\n\n\n
    \"Webflow<\/figure>\n\n\n\n

    2. Click on the alphabet W <\/strong>icon present in the top left corner of the design window.<\/em><\/p>\n\n\n\n

    \"Desgin<\/figure>\n\n\n\n

    3. Under Project Settings<\/strong><\/em>, you will see the Custom Code<\/strong><\/em> feature, visit the section and check for the Footer code option.<\/strong><\/em><\/p>\n\n\n\n

    \"custom<\/figure>\n\n\n\n

    4. Visit the Footer code<\/strong><\/em> option and add the Kommunicate Install script<\/a> inside the code section as shown below and click on Save Changes.<\/strong><\/em><\/p>\n\n\n\n

    NOTE: You will have to select the Kompose chatbot from the RULES section of the Kommunicate dashboard to handle all the incoming conversation so that chatbot will handle the new conversations.<\/pre>\n\n\n\n
    \"footer<\/figure>\n\n\n\n
    5. Now, go and Publish your site using the Publish<\/strong><\/em> option given on the top right corner of the page.<\/p>\n\n\n\n
    \"Add<\/figure>\n\n\n\n
    6. Chat widget is added successfully<\/p>\n\n\n\n
    \"Chatbot<\/figure>\n\n\n\n
    Now, your website users can use the chat option to get a help about your product and all these chats can be monitored from the Kommunicate dashboard, also support agents can involve in handling chats when chatbot is unable to answer.<\/p>\n\n\n
    \n
    \"book<\/a><\/figure>\n<\/div>\n\n\n
    Here’s a quick video:<\/p>\n\n\n\n
    \n