In an age where a majority of interactions are done on smartphones, it’s not always appropriate to see chatbots as bubbles on the backend of websites. Following the redesign of Deeplink’s frontend this summer, many possibilities to include its virtual agent in its site have been added. Here is the presentation of the different integrations, as well as our advice on how to showcase your chatbot.
Popup bot – the classic
The popup bot, which the user activates by clicking on the “bottom right” icon, is the classic approach. To integrate it in Deeplink, nothing could be easier.
<head> of your web page.
Next you can move on to embedding the bot widget itself. To do this, insert the following code at the end of your tag
In this example,
BotID must be replaced by the identifier of your bot (which will look like an alphanumeric sequence such as “d5cvzlfxouan2ez”). The second parameter allows you to choose between the
staging environment (useful for the validation of a new version of the bot). Third, it is possible to define the language of the chatbot. Even if the user can change the language in the bot, we encourage you to change this parameter dynamically, so that the user has the same language between the site and the bot.
Why not make your bot central, by putting it in the middle of a page? This is easily possible with the inline mode. Instead of being only on the side, it will be included in the full width of your central container, as in the attached screenshot.
In order to include the bot in inline mode, you must first create a container div with an ID. In the following example, we have called it
bot-container, and set a height of 70% of the screen height.
<div id="bot-container" style="height: 70vh;"></div>
Then we can proceed to embed the bot widget. As in the first example, insert the code at the end of your
<body> tag. Note that the reference to the
mode:"inline" as well as the mention of the
Calling the bot – advanced interactions
Showcasing your virtual assistant doesn’t stop at presenting it on a page. It is sometimes useful to be able to open it at the click of a button, or even to go directly to an element of the dialogue. Here are the advanced interactions available
Opening and closing the bot
If you need to close the bot, it is also possible with:
Redirect to a part of the dialogue
It is also possible to redirect to a specific part of the bot’s dialogue. Combined with the open action, this allows you to click a button to open and load the dialog directly onto a feedback conversation, or appointment setting for example.
You can either open the bot on a particular message, or on an intention
To open the dialog on an intent, the call is similar and prefixed by
intent_. For example, to call the “Contact” intent, you can use
Would you like to see this in action, have a demo? No problem, here’s a button to contact Deeplink.
Open on load
Finally, it is also possible to open the bot as soon as the page is loaded. This is done with the following call:
Please note that from a smartphone, such a call means that the whole site is hidden, since the bot automatically takes all the space on the screen. We advise you not to underestimate the impact of such an opening on loading, and to possibly treat the cases differently between mobile and desktop.