Installing your webchat widget
How to customize and set up your webchat widget
To get started, go to Admin > Webchat.
There you will find the default configuration of the widget. You can just copy the config code and paste it into the <head> section of the HTML of your website in order to start receiving webchat messages.
If you'd like to add a bespoke configuration to your widget to reflect your brand and messaging, you can do this in a few easy steps:
On the left hand side of the configurator you will see various parameters that you can set by ticking the relevant box:
On the right hand side you will see a view of the widget as it will display on your website, which will change after a few seconds (there is a preview countdown bar at the top of the screen) to illustrate your configuration settings:
WhatsApp click to chat button - if you also have a WhatsApp Business Account and number configured on Converso, you can add a button on the widget to give customers a choice to contact you over WhatsApp if they prefer
SMS chat button - similarly, if you have an SMS service and number configured on Converso, customers can also contact you via SMS text via this button
Display logo - you can add your company logo to the header of the widget
Display name - this will display your business name, as saved under Settings > Business.
Container element - this defines which element the widget will be inserted into, eg "body"
Show "log-in" button (coming soon) - this allows your customer to login to retrieve their past messages, documents, invoices etc
Floating over the page - this enables the widget to float on the page and not move when the page is scrolled. This would be the result if it was embedded in a specific place on the page. We would recommend that the widget is floated in the bottom right hand side of the page for most use cases.
The next section allows you to define positioning and colouring:
You can align the widget vertically or horizontally, with different margins and height/width.
The header colour also changes the colour of the widget icon to match your company colours:
The header text colour can also be defined.
The next section defines the widget's labelling and messaging:
Tagline - this defines the strapline underneath the business name in the widget header
Initial SMS/WA message - this pre-populates in the customer's message box the first message a customer can send you when they open their SMS or WhatsApp app
Initial webchat message - this is a conversation starter and pre-populates in the widget's message panel your first message to the customer when they open the webchat widget
Secondary webchat message - this is the second message to the customer, following from the first message (above), to make the initial interaction more conversational
Welcome text - this message appears in the bubble above the widget when it is unopened on your website, encouraging users to click on it to open and send a message
Webchat button label - this is the text on the webchat label on the first page of the widget
WhatsApp button label - this is the text on the WhatsApp label on the first page of the widget
As above, you can experiment with the above settings and see how they appear on the widget, before embedding on your site (apart from the SMS/WA/webchat messages).
Once you have defined the settings, click on the "copy embed code" and paste it into the </body> section of custom HTML code for your site. Your widget will then be live on your website and you can start receiving and sending messages.
If you have any issues, then just get in touch and we'll help you with the install.
In the present version of the widget, if you update any of the fields, you will then need to re-install the widget to display the updates (we are working on an update where these fields will access their parameters centrally, so you can make updates which will become live instantly, without needing to re-install the widget).
Last updated
