How to open Live Agent prechat form in a new tab, instead of a popup

Question

Live Agent currently opens the Prechat form in a popup window. I want to open the Prechat in a new Tab instead.

The popup window can get lost behind users' other windows. The popup window also doesn't flash or anything when a chat is connected. This is a problem because if a customer is waiting 5 minutes to be connected to a chat, they need to be reminded when they are connected, or else they might not notice while they're checking their email.

This is the only setting I can find regarding the Live Agent window size. No option to open it as a new tab, as opposed to a popup: liveagent.setChatWindowHeight(590); liveagent.setChatWindowWidth(500);

If the customer has the chat as a Tab, I'm hoping I can make the tab flash when a new chat comes in. That way the customer will see it. I also plan on playing a noise when the chat is connected, which would be a nice Out-of-the-box feature, too.

But how to have it as a tab?

UPDATE: After some research, having the chat open in a tab is difficult, so I'd prefer to bring Focus to the popup window when the agent sends their first message. I have an event I can use to trigger javascript when the agent sends their first message, but I don't know how to write javascript that will successfully bring focus to the popup (bring it to the front of their browser windows). I've looked into window.opener but I don't see how to use window.opener with the live agent environment.

Answer 1

You can use startChatWithWindow.

In this method you can provide window name, You can create blank window / tab and provide reference to this window in above method.

Other resources :

• Live Agent developer guide

• Video on setting up live agent (Basic)

Answer 2

You have to use the liveagent.chasitor.Events.CHAT_ESTABLISHED event to bring attention of the user. Sometimes back I have also tried to implement similar solution, but could not found a cross-browser solution to highlight the minimized window or to bring it to focus.

As a workaround I am playing a sound file when Agent accepts the chat. Please find the below code snippet on how to do this. Also there is a default sound available when Agent starts typing. Hope this helps.

<script type='text/javascript'>
    var audio = new Audio('http://talkerscode.com/webtricks/demo/audio_file.mp3');
    liveagent.addEventListener(liveagent.chasitor.Events.CHAT_REQUEST_SUCCESSFUL,myCallBack);
    liveagent.addEventListener(liveagent.chasitor.Events.CHAT_ESTABLISHED,newagent);


    function myCallBack() {
          var details = liveagent.chasitor.getDetails();
        //..
    }
    function newagent() {
      var details = liveagent.chasitor.getDetails();
      audio.play();
    }    
</script>