How do I generate and add a Whatshelp widget to my Webflow page?

Published on
September 22, 2023

To generate and add a Whatshelp widget to your Webflow page, follow these steps:

  1. Sign up for a Whatshelp account: Visit the Whatshelp website and sign up for an account. You will need to provide your email address and create a password.

  2. Create a widget: After signing up, log in to your Whatshelp account and go to the "Widgets" section. Click on the "Create New Widget" button to start creating a widget.

  3. Customize your widget: In the widget customization section, you can choose various options such as the chat icon style, position, colors, and texts. Make sure to customize your widget to match your website's branding.

  4. Generate the widget code: Once you have customized your widget, click on the "Generate Code" button. This will generate a JavaScript code snippet that you need to add to your Webflow website.

  5. Copy the widget code: After generating the code, copy it to your clipboard. The code should start with <script> and end with </script>.

  6. Open your Webflow project: Log in to your Webflow account and open the project where you want to add the Whatshelp widget.

  7. Add a custom code component: In the Webflow Designer, go to the page where you want to add the widget and select the element where you want the widget to appear. Click on the "+" icon and select the "Add Custom Code" option.

  8. Paste the widget code: In the custom code settings panel, paste the widget code you copied from Whatshelp into the "Head Code" section. Make sure to paste the code without any modifications.

  9. Publish your website: After you have added the widget code, click on the "Publish" button in the Webflow Designer to publish your website changes.

  10. Verify the widget: Once your website is published, visit your website and check if the Whatshelp widget appears correctly. You should see the chat icon or button according to your customization settings.

By following these steps, you should be able to generate and add a Whatshelp widget to your Webflow page successfully.

Additional Questions:

  1. How do I sign up for a Whatshelp account?
  2. Can I customize the appearance of the Whatshelp widget?
  3. Can I add the Whatshelp widget to multiple pages on my Webflow website?