🆕Web V2

In 2023 we've been working on creating a new widget with a more modern feel and optimized mobile performance. Below you can find out all about it!

Old to new

Customers who have configured bots on our former widget will not be transferred automatically. If you want to give our new widget a try, you can do so by logging a ticket via the support platform (read more on our support page)

Create and configure your widget

To create a web channel with the new widget, you have to follow a few short steps:

  1. Navigate to the channel page on your bot

  2. Press the add channel button in the top right

  3. Look for 'Web'

  4. Select 'Web' and click on the 'Next' button

Make sure your widget is created on the correct version of your bot.

Style your widget

Once you have created the new Web channel you will arrive at the configuration page of your new widget. The first two tabs "Basics" and "Style" will allow you to change the appearance of your bot. That way you can ensure the branding of your new widget corresponds to the one your company uses.

On the 'Basics' page you can make a number of changes:

  • The title and subtitle of the widget will appear at the top of the widget. Make sure to leave them empty if you don't want any title to appear.

  • Enabling text is on by default and will allow your customer to type text towards your bot. Make sure to turn this off if you want your bot to be used solely as a click bot.

  • Enabling file upload will make the paperclip to the right of the input-box appear. This will allow your customer to send files to your chatbot.

  • Enabling sound notifications activates audible alerts for your bot's message replies.

  • Uploading images for header logo, bot avatar, or launcher

On the 'Style' page you can make a number of changes:

  • Change the position of your widget to bottom right or bottom left

  • Customize your brand color, conversation color and action color

After styling your widget, click 'save' and simply press 'Preview' to see its appearance post-installation.

Embed customized widget on your website

After having configured your widget you can start embedding it on your website.

To embed your website widget, follow these easy steps displayed on the screen:

  1. Go to 'Installation' page

  2. Include the displayed script in the header section of every HTML page where you want it to appear.

  3. Additionally, place the provided snippets at the end of the body section on each HTML page of your website.

If you are embedding the iframe, you can set the language by adding the language as a query parameter to the iframe URL. For example:

https://webchat.chatlayer.ai/embedded/botId:channelId?language=en

Last updated