Using Nicereply surveys as a custom message in LiveAgent after a chat

The new LiveAgent Live Chat Tracking feature allows you to display a custom message popup window right after you finish a chat with your customers. 

The way it works is that you copy and paste pre-defined HTML code into your chat plugin settings and then every time a chat ends a custom message is displayed. You can find the original setup manual that explains how to enable this feature here: https://support.liveagent.com/392580-How-to-display-a-custom-message-to-the-customer-after-chat

If you'd like to display a Nicereply satisfaction survey in the popup window after you end a chat the setup process is very easy. 

1. Find the Live Chat Tracking plugin in your agent panel > Configuration > System > Plugins

2. Activate the plugin by clicking on the 'Activate' button next to it

3. When the plugin is activated, the agent panel will reload. Then navigate back to the plugins section and click on the 'Configure' button

4. Popup with the plugin's setting will show up. Use the field called 'Track End Chat'

5. In the 'Track End Chat' field enter the following code:

try {
var node = document.createElement("div");
node.setAttribute("id", "modal_plugin");
node.innerHTML =  `<div id="modal_blocker" style="position: fixed; top:0; left:0; width:100%;height:100%;opacity:0.6;z-index:999998;background:#000;"></div>
<div id="modal_window" style="z-index:200; position:fixed; left:50%; top:50%; width:500px; height:600px; z-index:999999; background:#fff; border:3px solid #fff; box-shadow: 0 0 10px rgba(0,0,0,0.5);">

<iframe src="https://URL_TO_YOUR_FORM_OR_WEBSITE" width="500" height="600" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>

<div id="modal_close" style="position:absolute; top:0; right:0; margin-top:-30px; margin-right:-30px; cursor:pointer; color: #fff; font-size: 25px; font-family:Arial; display: inline-block; padding:5px;">&#x2716;</div></div>`;
document.body.appendChild(node); 
    var modalWrapper = document.getElementById("modal_blocker");
    var modalWindow  = document.getElementById("modal_window");                                    
    modalWindow.style.marginTop = (-modalWindow.offsetHeight)/2 + "px";
    modalWindow.style.marginLeft = (-modalWindow.offsetWidth)/2 + "px";
 
    var closeModal = function(e)
    {
      document.getElementById("modal_close").removeEventListener("onclick", closeModal);
      document.getElementById("modal_blocker").removeEventListener("onclick", closeModal);
      if (document.getElementById("modal_plugin") != null) document.getElementById("modal_plugin").remove();
    };

    document.getElementById("modal_close").addEventListener("click", closeModal, false);
    document.getElementById("modal_blocker").addEventListener("click", closeModal, false);

  } catch (e) {
}<br>

6. Now, in your Nicereply account click NEW SURVEY in the top left corner

7. Choose metric: CSAT, CES, or NPS

8. Then, choose Email template distribution

9. Click skip integrations at the bottom of the screen

10. in the next step you can import your agents from LiveAgent to Nicereply, then click Continue

11. Now, copy the survey code and switch back to LiveAgent 

12. Remove this part of the original code:

<iframe src="https://URL_TO_YOUR_FORM_OR_WEBSITE" width="500" height="600" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>

And replace it with the Nicereply code. When you're done click Save. 


Great job!

Now, every time your agents end a chat Nicereply satisfaction survey will be displayed in the LiveAgent popup window.