We don't have a live chat feature. We'll include this feature only if we have enough demand.
If you need this feature, please contact Camille at camille@joonbot.com.
However, we have a solution! You can combine Joonbot with another live chat solution.
You can use our JavaScript block to go from Joonbot to a live chat solution.
Most of the time, live chat solutions also have a function to open the live chat interface.
On our side, we have a function that allows you to close the Joonbot interface during the conversation.
So you can include at the moment you want, a JavaScript block, that will close the Joonbot interface and open the live chat one (like tawk.to).
Here are the steps to follow :
How to handle human takeover with Joonbot and Crisp.chat
Here is a video that shows you how it can look like. 😊
1. Install Joonbot on your page
Check our Joonbot installation section for more information.
2. Install Crisp.chat widget on your page
- Go to https://app.crisp.chat/settings/websites/
- Then click integrations
- Go to HTML
- Copy the script tag
In the file serving the first portion of your HTML (<head />) section, copy and paste the code we provide you just before the <head /> tag.
If you can't find the <head /> tag, you can also copy the chatbox code before the end of the HTML body, eg: right before the <body /> tag.
You can also add the script using an HTML component of your CMS.
3. Add the hide function into your script to hide Crisp by default
The function to add is this one:
$crisp.push(["do", "chat:hide"]);
So you'll need to add this line to your installation script like behind:
<script type="text/javascript">
window.$crisp=[];window.CRISP_WEBSITE_ID="41894f7e-2887-45a8-a8f4-c3252e3e7365";
(function(){d=document;
s=d.createElement("script");
s.src="https://client.crisp.chat/l.js";
s.async=1;d.getElementsByTagName("head")[0].appendChild(s);})();
$crisp.push(["do", "chat:hide"]);
</script>
4. Add a button block to ask the user if he wants to talk with an agent
5. Add a JS block with the code below
joonbot.hide();
$crisp.push(["do", "session:reset"]);
$crisp.push(["do", "chat:show"]);
$crisp.push(["do", "chat:open"]);
Here are some explanations:
joonbot.hide();
=> Hides Joonbot
$crisp.push(["do", "session:reset"]);
=> Resets the conversation, so you don't have the historic
$crisp.push(["do", "chat:show"]);
=> Shows Crisp
$crisp.push(["do", "chat:open"]);
=> Opens the Crisp chat interface
6. Bonus: You can send data from your Joonbot to your Crisp live chat
You just need to add functions in your Javascript code.
Here are some useful functions you case use:
$crisp.push(["set", "user:nickname", ["{{name}}"]]);
=> Sends the name collected by Joonbot to Crisp
Joonbot can ask for the name's person and save it under the variable {{name}}. Then, with the Javascript block, Joonbot can send the info to Crisp.
$crisp.push(["set", "user:email", ["{{email}}"]]);
=> Sends the email collected by Joonbot to Crisp
Joonbot can ask for the email's person and save it under the variable {{email}}. Then, with the Javascript block, Joonbot can send the info to Crisp.
$crisp.push(["set", "session:data", [[["massage type", "{{massage_type}}"]]]]);
=> Sends all other types of info you collected by Joonbot to Crisp
For example, if the Joonbot is in charge of booking a massage for users, Joonbot can ask which type of massage the user wants and save it under the variable "massage_type".
Then, with the Javascript block, Joonbot can send the info to Crisp.
You can find other Crisp functions like these in their SDK documentation.
How to handle human takeover with Joonbot and Zendesk chat
1. Install Joonbot on your page
Check our Joonbot installation section for more information.
2. Install Zendesk chat on your page
3. Select only the chat option of the widget
4. Add a button block to ask the user if he wants to talk with an agent
5. Add a JS block with the code below
joonbot.hide();
zE('webWidget', 'show');
zE('webWidget', 'open');
6. That's it!
How to handle human takeover with Joonbot and Tawk.to
1. Install Joonbot on your page
Check our Joonbot installation section for more information.
2. Install Tawk.to on your page
3. Add a button block to ask the user if he wants to talk with an agent
4. Add a JS block with the code below
joonbot.hide();
Tawk_API = window.Tawk_API || {};
Tawk_API.showWidget();
Tawk_API.maximize();
5. That's it!
Important
Keep the option "remember visitors" deactivated so that the user can come back and talk with Joonbot next time.
Comments
0 comments
Please sign in to leave a comment.