WebChat

With this guide you will learn how to configure the WebChat channel in your campaigns. This channel allows you to integrate a live chat directly on your website to communicate with your visitors in real time. Let's get started!

Prerequisites

Before configuring the WebChat channel, make sure you have:

• Campaign created: you must have at least one campaign created where you can configure the channel. If you don't have one yet, you can create it through the following campaign creation guide.
• Access to your website: you will need to be able to add JavaScript code to your website to integrate the WebChat widget.

General

From this section you configure parameters related to the functioning of the channel.

Available settings

• Status: allows you to enable or disable the channel. If disabled, interactions cannot be managed through the channel.
• Strategy: defines how incoming interactions will be distributed among available users. See strategies. Make sure to select the strategy that best suits your business model.
• Service level: establishes the maximum desired time in seconds for an interaction to be attended. The campaign dashboard will show the compliance percentage. If the time is exceeded, the interaction will still be attended, but it will only affect the Service Level metric.
• Send offline messages to this address: email address where data from interactions received outside of business hours will be sent. The email will include the information requested in the WebChat interaction start form.
• Maximum transfer time: maximum time in seconds that the user who received a transfer has to attend the interaction. After this time, the interaction will return to the original user who transferred it. If set to 0, transfers will have no time limit.
• Max. interactions per agent: maximum number of simultaneous WebChat interactions that each agent of this channel can manage. If set to 0, there will be no maximum interactions.
• Maximum number of chats: maximum number of WebChat interactions that can remain in the queue waiting to be attended. Once the limit is reached, new visitors will see a message indicating that the service is temporarily unavailable. If set to 0, there will be no maximum interactions.
• Auto-finish: maximum time in seconds of customer inactivity before automatically finishing the interaction. If the customer disconnects or stops responding, the interaction will be finished after this time.
• Allowed domains: list of URLs of websites from which the WebChat can be used. This prevents the widget from being used on unauthorized sites. You can add multiple domains separated by commas.
• Maximum time in queue: maximum time in minutes that an interaction can remain in the queue waiting to be attended. After this time, the conversation will be automatically closed and the customer will be told that they could not be attended. If set to 0, there will be no maximum.
• Allow attachments: if enabled, allows visitors to send file attachments during the interaction.
• Offline message: if enabled, when the campaign is out of hours, visitors can leave a message that will be sent by email to the configured address. Then, from the Interactions screen, it will be possible to view these interactions.

Automations

From this section you can configure different types of Bots to automate responses and processes in the WebChat channel.

Available settings

• Bot on start: select a previously created Bot that will interact with the visitor automatically when they start an interaction. For example, you can configure a Bot that sends an initial response confirming receipt or requesting additional information.
• Bot on finish: select a Bot that will be executed automatically when the user finishes the interaction. It's ideal for sending satisfaction surveys, requesting feedback, or providing additional information.
• Bot after timeout: select a Bot that will be executed automatically if the interaction exceeds the maximum time in queue without being attended. It can send a message apologizing for the delay and estimating a response time.

Form

From this section you can configure what information will be requested from the customer before starting the interaction. Each field has a checkbox to enable or disable it and to select whether it is required or not.

Default fields

• Name: if enabled, the customer will be asked to enter their name.
• Email: if enabled, the customer will be asked to enter their email address.
• Phone number: if enabled, the customer will be asked to enter their phone number.
• Message: the message field will always be available for customers to write an initial message.

Custom fields

You can create additional custom fields according to your business needs:

1. Click on Custom field to add a new custom field.
2. Assign a name that will appear in the form for this field (e.g.: "Order number", "ID", "Claim number", etc.). Then, click on the + icon.
3. Now that you have the field created, you can enable whether it is required or not, that is, whether you want it to be mandatory for customers to complete this field when starting the interaction.

Required or not?

For each field (default or custom) you can activate the 'Required field' option to make it mandatory for the customer to complete it before starting the conversation.

Texts

From this section you configure the custom messages that will appear in the WebChat widget.

Available settings

• Welcome: initial message that the visitor will see when opening the WebChat widget, before starting the conversation.
• Agent unavailable: message that will be shown when there are no campaign members available to attend interactions.
• Out of hours: message that will be shown when the campaign is out of business hours.
• Rating: message that will be shown when finishing the interaction, so customers can leave a message about the service received from the user.
• Wait time: message that will be shown to the visitor while they wait in the queue to be attended.
• Add language: allows you to add translations of all these messages in different languages to support international visitors.

Code

From this section you obtain the JavaScript code necessary to integrate the WebChat on your website.

Available settings

• Code: JavaScript code that you must copy and insert in the HTML of your website. This code will load the WebChat widget. If you have any issues when doing this, you can contact our support team.
• Download WordPress plugin: if your website is built with WordPress, you can download a plugin that facilitates WebChat integration without needing to edit code.

Appearance

From this section you can customize the visual appearance of the WebChat widget to match your brand identity.

Available settings

• Color: main color of the widget (header, buttons, etc.). Select your brand's primary color.
• Show agent name: if enabled, the name of the agent who is attending the interaction will appear visible to the visitor in the chat.
• Show image in message: if enabled, an avatar or image will be shown next to each agent message.
• Show agent image: if enabled, the agent's profile photo will be shown in the chat header.
• Campaign image: image or logo that will be shown in the chat widget header before an agent attends the conversation.

Test

From this section you can test the operation of the WebChat with the current configuration without needing to integrate it on your website.

How to test?

• Open example: click this button to open a test window where you will see exactly how the WebChat widget will look for your visitors. You will be able to start a test conversation that will arrive at the Inbox like any interaction.

Important considerations

• No connector required: Unlike other channels, WebChat does not require configuring external connectors. It is native to uContact and you only need to integrate the code on your website.
• Simple integration: You only need to copy and paste the JavaScript code provided in the HTML of your website for the widget to work.
• Complete customization: You can customize colors, messages, images and texts so the chat reflects your brand identity.
• Multiple languages: Configure messages in different languages to support international visitors.
• Secure domains: Use the "Allowed domains" configuration to prevent your widget from being used on unauthorized sites.
• Tests before production: Use the "Test" function before integrating the code on your website to make sure everything works correctly.
• Simplified WordPress: If you use WordPress, the downloadable plugin facilitates integration without needing to edit code. :::

Frequently Asked Questions

Do I need technical knowledge to integrate the WebChat?

Not necessarily. If you have access to the HTML code of your website, you only need to copy and paste the JavaScript code provided. For WordPress, there is a plugin that does not require editing code.

Does the WebChat work on mobile devices?

Yes, the WebChat widget is responsive and automatically adapts to different screen sizes, including smartphones and tablets.

Can I completely customize the widget design?

You can customize colors, images, messages and show or hide elements such as the agent's name and photo. For more advanced customizations, consult with the support team.

Can visitors send files through the WebChat?

Yes, if you enable the "Allow attachments" option, visitors will be able to send images, documents and other files during the conversation.

Can I have the same WebChat on multiple websites?

Yes, you can use the same code on multiple sites. However, for greater security, configure all domains in the "Allowed domains" option.