Getting Started with Widgets

Start saving time and automating routine processes by leaving this work to a highly-intelligent widget. You can customize the widget’s appearance, teach it to welcome visitors with the right message at the right time, analyze data based on the visitor’s behavior to create even more effective scenarios, and convert visitors into trusted customers.

It’s a simple formula: attract -> engage -> subscribe -> convert. This subscription allows you to contact visitors any time and close the deal, even if a visitor leaves your site. Then, analyze the data you received from each step of the process.

Your journey begins with creating your first project as if one project equals one website and various scenarios of events and messages.

To get started click Create project and name your project.

You can choose whether you want to create only an live version of your widget or add a button to subscribe to your Facebook Chatbot and use all of the expanded features.

If you want to create a widget without a Facebook Chatbot, skip the next section and continue to customize it.

How to Connect Your Business Facebook Page with Widget

Save information about your customers. In this way users will be saved to your auditory with useful information and you can send them campaigns and engage in chatbot scenarios.

To connect your Facebook business page move the switch.

Click Continue with Facebook.

Log in to your personal Facebook account, where you are the admin of business pages you want to connect.

Choose the business pages you want to add to 13chats.

Provide the necessary permissions.

When you finish, click OK.

Choose the page you want to connect to a widget.

Now let’s learn how to customize your widget to match your company design and specific behavior.

How to Customize your widget

Make your widget unique and customize its design to match your company colors. Choose default widget behaviour and a greeting message that will appear each time unless you create different triggers.

You can return to project settings any time you need to change something by clicking on your project in the top menu.

Choose an Appearance – Add More Colors

Navigate to the Profile and Appearance tab to choose a color scheme and chat alignment.

Customize the Default Greeting Message

Navigate to the Widget Settings tab and enter the widget title that your visitors will see in expanded widget mode. Visitors will see this title for your widget in all your website messages.

In the next field enter an impressive line of text for the default message inviting visitors to interact with the widget and get some help. Visitors will see this message each time unless you configure custom events.

When setting up your widget you can see a preview on the right side and see how the widget looks when collapsed and expanded.

Customize Default Behavior

Choose default widget behavior – how it will be shown to visitors: collapsedexpanded, or do not show(widget will be hidden until it is triggered by your scenario). Later you can test and analyze, which widget behavior gets more engagement and impression points, compare them and choose the best option.

Choose the frequency of showing your widget to visitors after a manual close. Later you can also add display conditions – what visitor behavior triggers your widget to display. For example, you can display a widget only if the user has been visiting the site for 30 seconds.

Check your settings again to make sure that everything looks good, if you’re finished, click Get the code.

How to Get a Code to Install Widget to Your Site

Navigate to the Widget Code tab, subscribe to your Facebook chatbot, and copy the code snippet from the next field.

Paste this script to your website page before the closing  tag.

To check if you installed the code correctly – click Check installation and enter your page URL. Then, click Check.

Congrats! Your first widget was successfully installed. Now you can configure additional website messages triggered by various events.

You can switch off this default website message at any time and users won’t see it. To do this navigate to the website message panel and move the slider.

Now let’s create event triggers to reach your visitors at the right time with the right message.

Updated: 22.04.2021

Read also: