Integrating a Resinq chatbot into your Webflow site can significantly enhance user interaction by providing immediate automated support. This guide will walk you through the process of embedding your chatbot using simple JavaScript code in the footer of your Webflow site.
Prerequisites
Ensure you have the following before starting the integration process:
- Log in to Resinq: Access your Resinq dashboard.
- Select Your Chatbot: Choose the chatbot you wish to embed from your list of chatbots.
- Navigate to Embed Section: Click or tap on the Embed tab within your chatbot's settings.
- Copy the Embed Code: Specifically for the Web integration, copy the HTML embed code provided.
Adding the Embed Code to Webflow
To add your chatbot to your Webflow site, you will need to insert the copied code into the Footer section of your site’s HTML markup.
Access Site Settings
Log into your Webflow dashboard and navigate to Site Settings.
Open Custom Code Settings
Go to the Custom Code tab which allows you to add scripts that affect the entire site.
Add Embed Code to Footer
Scroll to the Footer Code section, which is executed just before the closing </body> tag in your site’s HTML markup.
<!-- Paste your Resinq embed code below -->
<script src="https://newchat-ai-six.vercel.app/chatbot.js"></script>
<script>
Chatbot.init({
chatbotId: "clxelx9jx0001ghlho30v3qg3",
});
</script>Paste the previously copied chatbot embed code here.
Save Changes
Click Save Changes to ensure your code is saved and will be applied when the site is published.
Custom scripts added in Webflow will only appear on the published site and not within the Webflow designer preview.
Publishing Your Site
To see your chatbot in action, you need to publish your site:
- Navigate back to the Webflow dashboard.
- Click on Publish to update your live site with the changes.
Troubleshooting
If you encounter any issues after embedding your chatbot, consider the following solutions:
Chatbot Not Displaying
Chatbot Malfunctioning
Changes Not Reflecting
By following these steps, you can successfully integrate a Resinq chatbot into your Webflow site, enhancing the interactive capabilities and support offered to your site visitors.