Live Chat Widget

After assigning chat accounts to your support agents in  Live Chat Settings, your next step will be customizing chat widget for integration on any page(s) of your website. 

Go to  Administration » Support Channels and create a chat widget by clicking New » Widget at the top right and change the required settings to grab the code for further integration.

By default, the chat widget will popup once you are online. In case any issues, please make sure you use valid protocol. For SSL support, please turn it on at Live Chat settings.

Chat Widget to Use in Community

You can use chat widget right on your community pages, so if the customer won't find the answer in your help center, he would initiate a chat session with a support agent.

To integrate that option, select "External Scripts" in Menu where you can put the code of live chat widget.

Integrate Chat Widget to Pop-Up on Click

If you want to initiate a chat widget on link click that is located at contacts or other pages of your website, follow the below instructions.

  • Add live chat code on that page taken from Administration » Support Channels » Widget » edit the necessary widget profile;
  • Add similar link but with your title in the required place:
<a class="live-chat-link" href="#">Live Chat</a>
  • Add inline javascript on that page or to your js file:
<script type="text/javascript">
      $('.live-chat-link').on('click', function(e) {
          e.preventDefault();
          $('#ur-chat-open').trigger('click');
       });
</script>

You can modify the code to use your own id or class in the link and javascript.

If you want for the widget to be hidden even when support agents are online, add following inline style or to your css file:

 <style>
     #ur-chat:not(.chat-opened) {
          display: none !important;
      }
</style>

Opening Chat by Default

If you want the chat widget to open on page load, add inline javascript on that page or to your js file:

<script type="text/javascript">
      sessionStorage.setItem('urchat_isOpen', 1);
</script>
Is this article helpful?