If you are ready to switch from the Customerly Live Chat V1 to the new V2 this is the tutorial you should follow.
There are 4 things to update when you are fully migrating to the V2:
Depending on what you are currently using you will need to update them.
The V1 Javascript Snippet you have installed is something like this:
<!-- Customerly Integration Code -->
<script>
window.customerlySettings = {
app_id: "PROJECT_ID"
};
!function(){function e(){var e=t.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://widget.customerly.io/widget/00c4ed07"; var r=t.getElementsByTagName("script")[0];r.parentNode.insertBefore(e,r)} var r=window,t=document,n=function(){n.c(arguments)}; r.customerly_queue=[],n.c=function(e){r.customerly_queue.push(e)},r.customerly=n,r.attachEvent?r.attachEvent("onload",e):r.addEventListener("load",e,!1)}();
</script>Replace this code with the following one:
<!-- Customerly Live Chat Snippet Code -->
<script>
!function(){var e=window,i=document,t="customerly",n="queue",o="load",r="settings",u=e[t]=e[t]||[];if(u.t){return void u.i("[customerly] SDK already initialized. Snippet included twice.")}u.t=!0;u.loaded=!1;u.o=["event","attribute","update","show","hide","open","close"];u[n]=[];u.i=function(t){e.console&&!u.debug&&console.error&&console.error(t)};u.u=function(e){return function(){var t=Array.prototype.slice.call(arguments);return t.unshift(e),u[n].push(t),u}};u[o]=function(t){u[r]=t||{};if(u.loaded){return void u.i("[customerly] SDK already loaded. Use customerly.update to change settings.")}u.loaded=!0;var e=i.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://messenger.customerly.io/launcher.js";var n=i.getElementsByTagName("script")[0];n.parentNode.insertBefore(e,n)};u.o.forEach(function(t){u[t]=u.u(t)})}();
customerly.load({
"app_id": "PROJECT_ID"
});
</script>
<!-- End of Customerly Live Chat Snippet Code -->
If you were authenticating your users, you can now do this with this piece of code
customerly.load({
app_id: "PROJECT_ID",
user_id: "REPLACE WITH YOUR USER ID",// Optional
name: "REPLACE WITH USER NAME",
email: "REPLACE WITH USER EMAIL"});If you want to add user attributes add this piece of code
customerly.load({
app_id: "PROJECT_ID",
user_id: "REPLACE WITH YOUR USER ID",// Optional
name: "REPLACE WITH USER NAME",
email: "REPLACE WITH USER EMAIL",
//Add your custom attributes of the user you want to track
attributes:
created_at: 1384902000, // Add dates as Unix timestamp
license_expire_at: 1603490400
// Add any other attribute here with value_key:value
}
});Widget Position
If you were controlling the positioning of the live chat with the widget_position you can now use the new line direction
customerly.load({
app_id: "PROJECT_ID",
// Custom options
direction: "right|left"
});Widget color
If you were using the widget_color you should use the new accentColor. The widget colour now has 2 variables accentColor and contrastColor.
customerly.load({
app_id: "PROJECT_ID",
// Custom options
accentColor: "#220033",
contrastColor: "#ffffff"
});Force Single Conversation
customerly.load({
"app_id": "PROJECT_ID",
"singleConversation": true
}); customerly('show');You should replace it with
customerly.show();Hide Live Chat
To hide the live chat programmatically you might be using
customerly('hide');You should replace it with
customerly.hide();Open Live Chat
To open the live chat programmatically you might be using
customerly('open');You should replace it with
customerly.open();Close Live Chat
To close the live chat programmatically you might be using
customerly('close');You should replace it with
customerly.close();If you were sending events to customerly and using the following function
customerly("event", "event_name");You should now replace it with
customerly.event("event_name");If you were using functions to update user attributes like this:
customerly("attribute", "attribute_name", "attribute_value" );
You should now replace it with
customerly.attribute("attribute_name", "attribute_value");This is everything you need to know. To discover more about how to take full control of your live chat features, please read this tutorial: How to take full control of your live chat with custom Javascript.