Embedding for Webflow
A Guide on How to Embed Chat Widget for Webflow Users.
Last updated
A Guide on How to Embed Chat Widget for Webflow Users.
Last updated
Embedding a chat widget for Webflow is a simple process that can be completed in a few easy steps. Here's how to do it.
Sign in to Wonderchat App
Inside your Wonderchat dashboard, click on the action dropdown button (⋮) to select the “Embed to website” option.
This code will be used to embed the widget on your Webflow site. You may choose between the formats you wish to embed:
Chat Widget
Chat Screen
If the chatbot widget needs to be resized or repositioned, you can modify your changes on the Wonderchat App before copying the embed code over.
For a more detailed guide on how customize your chat widget or page, see the pages below:
Log into your Webflow account and ensure that you are on a premium subscription plan, as this is the only way to access the 'embed' function.
Navigate to the page where you want to embed the widget.
To ddd an Embed element: In the Elements panel, click on the "Embed element" and drag it to the location on the page where you want to embed the widget.
Paste the widget's code: Double-click on the Embed element to open the code editor. Paste the widget's code into the editor and click the 'Save' button.
Preview the page: Click the 'Preview' button to preview the page and make sure the widget is displaying correctly.
Ensure the chatbot works properly by interacting with it on your live store. Test the chatbot's functionality across different devices (desktop, tablet, mobile) to make sure it's responsive.
That's it! You have successfully embedded a chat widget on your Webflow site. Visitors to your site can now use the chat widget to get in touch with you.
If you have any more questions, feel free to reach out to us at support@wonderchat.io
