Callback widget

In this section, you will learn how to configure and install the callback widget on your website. This feedback widget allows visitors to easily get in touch with your company and ask questions, helping you:

• Improve customer interaction,

• Provide prompt support,

• Collect valuable feedback and suggestions to enhance user satisfaction.

Settings

Please note

Ensure a telephony integration is enabled before setting up the feedback widget. This is required for installation.

Main information

Main information settings

This section contains two required fields to set up your widget.

1. Name Enter a name for the widget, which will be displayed on your website. This field is required.

2. Domain Where the Widget Will Be Used Enter the domain of the website where the widget will be embedded. This field is also required. You can specify a website built on:

   • MaviBot

   • Tilda

   • Your own custom website

Advanced settings Within the main information section, you can also enable callback notifications in the advanced settings.

The feedback widget callbacks do not match the callbacks from the connected telephony.

You can configure the chatbot’s response to the received callbacks later.

You can also choose to show or hide the "We use MaviBot" logo using this checkbox.

Trigger conditions

Time interval

You can set the timing for the widget to appear on the website. To do this, use the “When to show the widget” feature.

1. Instantly This setting will display the widget as soon as the user opens the website.

2. After a delay

The widget will appear a specified number of seconds after the user opens the website.

A time interval is set in seconds, with a minimum value of 1 second and a maximum of 15 seconds.

1. After scrolling

The "After scrolling" condition means that as soon as the user scrolls the website — whether they scroll to the very end or just a small part — the widget will appear on the website after the specified number of seconds.

The minimum time interval value is 1 second; the maximum is 15 seconds.

Display conditions on the website

You can set the widget to display with or without specific conditions. Let’s exlore the available conditions.

1. UTM parameters

To learn about UTM parameters and how to use them, we recommend reading the article, "How to transfer UTM Parameters."

Enter the name of the required parameter in the corresponding field.

Next, select the operator that matches the tag to the value:

What’s the difference between "contains/does not contain" and "equals/does not equal"?

The main difference is that "contains/does not contain" checks whether the UTM parameter includes (or does not include) a specific value anywhere within it.

In contrast, the "equals" operator requires an exact match, meaning the system looks for a strict equality of the UTM parameter value (and accordingly, "does not equal" is the opposite).

Then enter the required value for the UTM parameter:

1. Country

You can also select the "Country" condition, which displays the widget based on the user's IP country. Choose the required country from the list, as well as the operator type ("is" or "is not").

1. User's device

If needed, set the "Device" condition to display the widget based on the user's device type.

The settings also include a feature for adding multiple values to control the widget’s display. To do this, simply click "+ Add value" and set one or more additional conditions.

Telephony

Work schedule

The work schedule plays a key role for the checkboxes "Disable widget outside business hours" and "Disable auto-callbacks outside business hours"

When these checkboxes are enabled, the widget will be inactive and/or the auto callback feature will not work outside your staff's working hours.

This is very convenient because your clients won’t be left wondering why they requested a callback but didn’t receive one.

The "Enable scheduled callbacks at a convenient time" checkbox also uses the work schedule: it allows the system to offer the client the nearest available time for a call according to the established working hours.

To configure the business hours, simply use the following settings:

You can configure each weekday individually by toggling the switch to the off position.

Appearance

Appearance settings can be divided into button and widget settings.

Button settings

1. Button size: you can choose from large, medium, and small widget button sizes.

1. Button text

You can replace the phone icon with any desired text.

1. Button color: use the extensive color palette to choose the color that best suits your needs.

1. Button text color: if you fill in the empty field for the text displayed on the widget icon, you will be able to change the text color scheme.

1. Button animation helps enhance your website’s appearance and make it more lively.

How each button animation looks:

Pulse

Shake

Ripple

Widget settings

Once you’ve configured the button’s appearance settings, let’s move on to the content and the appearance of the widget itself.

You can fill in the text fields inside the widget:

1. Title

1. Subtitle

This field is required.

1. Widget text displayed after the timer starts

The text will appear in the widget only after the client clicks the "Call me back" button (or any other button text) during the timer countdown.

You set the widget timer using this setting:

1. Button text

You can align the text inside the widget to the center, left, or right using these buttons, just like in any text editor.

Using the extensive color palette, you can adjust the tone or gradient for the background, button colors, and even set a pattern.

How to embbed a widget on your site

After configuring all the settings and customizing the widget’s appearance to your unique design, click the "Add widget" button at the bottom of the screen.

You will be taken to the list of ready widgets, where you need to click the "Embed code on site" button.

After that, a modal window with the script will open.

Copy the script and go to the settings of the website where you entered the domain in the widget settings.

Then, insert the code into the HTML head section.

To embed the widget on a Tilda website, also copy the widget script using the “Embed code on website” button, then install it on the site.

Done! The widget setup and installation on the website are now complete!

Callbacks

Available callbacks:

1. widget_callback_later widget_id: 1 at 23.04.2024 18:00 - a delayed callback, where widget_callback_later is the callback type; widget_id: 1 at 23.04.2024 18:00 - indicates the widget ID along with the date and time when the call should be made to the client.

2. widget_callback_need_call widget_id: 1 at 23.04.2024 18:00 - indicates that the client needs a call, where widget_callback_need_call is the callback type; widget_id: 1 at 23.04.2024 18:00 - shows the widget ID and the scheduled date and time for the call.

3. widget_callback_now widget_id: 1 - callback signaling an immediate need to call the client, wherewidget_callback_now is the callback type; widget_id: 1 is the widget ID;

4. widget_callback_need_call - callback indicating a call is needed. This callback is sent if the corresponding setting is enabled.

5. widget_callback_now - callback indicating current call.