With Mouseflow, it's easy to seamlessly integrate into chat software like LiveChat.

Use

If a customer reaches out to you through LiveChat to report an issue on your website, this integration will let you use the Playback Link to jump straight to the Mouseflow Recording of the customer's visit to your site and see the issue first hand.


Setup: Adding the playback URL to LiveChat

Please follow this easy 3 step guide to integrate Mouseflow into your LiveChat modal:

1. Please copy the code below. The code will act as a replacement for your existing LiveChat code and serves to add the Mouseflow playback URL as a custom field (called mouseflow_url).

<script type="text/javascript">
window.__lc = window.__lc || {};
window.__lc.license = YourLicenseKeyHere;
(function () {
var lc = document.createElement('script');
lc.type = 'text/javascript';
lc.defer = true;
lc.src = ('https:' == document.location.protocol ?
'https://' :'http://') + 'cdn.livechatinc.com/tracking.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(lc, s);
})();

var LC_API = LC_API || {};

LC_API.on_after_load = function () {

window._mfq = window._mfq || [];
_mfq.push(function () {
var custom_variables = [{
name: 'mouseflow_url',
value: 'https://app.mouseflow.com/websites/'
+ mouseflow.websiteId + '/recordings/'
+ mouseflow.getSessionId() + '/play' },
];
LC_API.set_custom_variables(custom_variables);
});
};
</script>

2. To integrate Mouseflow into the LiveChat modal you will first need to replace "YourLicenseKeyHere" in the 3rd line of the code snippet:

(window.__lc.license = YourLicenseKeyHere;)

with your actual LiveChat license key (you can find this in your original LiveChat code snippet).

3. Once that's done, the updated code snippet should be installed on all pages where you want to enable LiveChat.

When the code is live, you should start seeing the mouseflow_url appear as a field in LiveChat.

Did this answer your question?