Using both Quriobot and Tawk-To!
So, although we have a live chat option in Quriobot you can use the best of both worlds!
Meaning that you use Quriobot to start your Tawk.To widget if a user wants to talk to a live person and switch back once that conversation is over!
Pretty cool, right? So here is the demo of Quriobot using Tawk.To widget as a fallback for the live chat:
The live demo is located here.
Step 0: In this explanation, I already assume you have a Quriobot running on your website.
Step 1: Include the Tawk.To installation code on your website:
Step 2: Enable developer mode:
Step 3: Add this code to the advanced initialization of the bot:
{
onInit: function() {
if (!quriobot.store.get('qbClosed')){
Tawk_API.hideWidget();
} else {
quriobot.hide()
};
Tawk_API.onChatEnded = function(){
setTimeout(function() {
Tawk_API.hideWidget();
quriobot.store.set('qbClosed', false);
quriobot.show()
}, 1000)
};
}
}
Step 4: We will make use of the Script Chat Text, Tawk.To Javascript API and Variables to pre-fill and open the widget:
function() {
quriobot.hide_frame();
quriobot.store.set('qbClosed', true);
setTimeout(function(){
document.getElementById("botbutton").classList.remove('show');
Tawk_API.showWidget();
Tawk_API.toggle();
}, 3000)
Tawk_API.setAttributes({
name: "{{name}}",
email: "{{email}}"
});
}
Note: we’re using {{name}} and {{email}} Bot variables to identify the user.
That’s it! If you add this as a response to an answer option, for example, you will start the Tawk.To widget chat and hide Quriobot. Closing the Tawk.To chat will make Quriobot reappear!
Enjoy!
](https://developer.helpscout.com/beacon-2/web/javascript-api/)