Providing targeted support with Zendesk Chat Follow

Comments

25 comments

  • Avatar
    Jonathan Semones

    Does this script still work?  I tried adding it to my help center using both the regular zopim chat option and the full blown zendesk widget and neither of them seemed to work.  When i was signed out I could still see the widgets.

    the only thing i changed about the script was changing the 'vip' tag to an 'active_client' tag that we use.

    It seems like it messes up some of my other js as well.

  • Avatar
    Sergiu Birca

    Hey Jonathan,

    this works for me:

    var user_tags = HelpCenter.user.tags;
    var vip = "vip";
    if ($.inArray(vip, user_tags) === 1) {


    window.zEmbed||function(e,t){var n,o,d,i,s,a=[],r=document.createElement("iframe");window.zEmbed=function(){a.push(arguments)},window.zE=window.zE||window.zEmbed,r.src="javascript:false",r.title="",r.role="presentation",(r.frameElement||r).style.cssText="display: none",d=document.getElementsByTagName("script"),d=d[d.length-1],d.parentNode.insertBefore(r,d),i=r.contentWindow,s=i.document;try{o=s}catch(e){n=document.domain,r.src='javascript:var d=document.open();d.domain="'+n+'";void(0);',o=s}o.open()._l=function(){var o=this.createElement("script");n&&(this.domain=n),o.id="js-iframe-async",o.src=e,this.t=+new Date,this.zendeskHost=t,this.zEQueue=a,this.body.appendChild(o)},o.write('<body onload="document._l();">'),o.close()}("https://assets.zendesk.com/embeddable_framework/main.js","mycompany.zendesk.com");


    zE(function(){
    zE.hide();
    $zopim(function() {
    setTimeout(function() {
    if ($zopim.livechat.isChatting() == true) {
    console.log("Chat is running!"); 
    $zopim.livechat.window.show();
    } else {
    console.log("Chat is not running!"); 
    zE.show(); // Show the Web Widget

    }, 1500);

    });
    });
    }

     

    Please place it in the JS section of your HC.

    Hope it helps.

  • Avatar
    Jonathan Semones

    After looking at it again i realized that the original scripts required the Zopim API, does your @sergiu?  Our level of Zopim doesn't include the API.

  • Avatar
    Sergiu Birca

    Jonathan,

    There are different APIs. The one you probably mean is Zopim REST API that is restricted for specific plans. In the above script I used Zopim JS API that is available on all the plans.

     

    https://api.zopim.com/files/meshim/widget/controllers/LiveChatAPI-js.html

  • Avatar
    Jonathan Semones

    Oh, Cool.  Well i'm not sure what i'm doing wrong then.  I placed that new script at the end of my JS page and replaced vip with active_client and replaced the mycompany part.  When i turn off the zopim chat setting in the Helpcenter settings the zopim widget disappears, when i turn it on it appears even when i am logged off.  Am i using the wrong widget, should i be using the full blown zendesk widget?

  • Avatar
    Sergiu Birca

    Jonathan,

    The script is for the Web Widget (that has as a component the Zopim chat), not the Zopim widget.

    Also, please uncheck the Zopim checkbox in the HC Settings. 

    Please the scrip just under this line in the JS page:

    $(document).ready(function() {

     

    Then as a Zopim agent login into Zopim and set yourself as Online (status). Simulate the end user interaction in an incognito window or a different browser (don't do it in the same browser where you are logged in as agent).

     

     

     

  • Avatar
    Jonathan Semones

    Is there a way to do this with the zopim widget?

    We are trying to require customers to log in before beginning a chat (that way our agents are not trying to answer sales questions, which is not part of their job).  The problem is that i use the zendesk widget on other sites.  If I enable chat in the zendesk widget it will enable it everywhere.

  • Avatar
    Sergiu Birca

    If needed, I can provide a script that will use the Zopim widget, but I would suggest you to have consistency and use the same widget on all the portals.

     

    To suppress the Chat option on specific websites / pages, you can use our new Web Widget API options (currently in beta):

    https://support.zendesk.com/hc/en-us/community/posts/218033707-Start-here-Web-Widget-customizations-beta

    webWidget: {
       chat: {
         suppress: true
       },

     

    To subscribe to beta:

    https://goo.gl/forms/cbeRc3ZTBywaK1Qi1

     






  • Avatar
    Jonathan Semones

    Can I get that script to use it with the zopim widget?  

     

    Currently we only use the zendesk widget to enter tickets from our other websites and don't have plans to include chat from there any time soon.  I did sign up for the beta, but it will be awhile before I can integrate that with the other sites.

     

    Thank you for you help.

     

  • Avatar
    Sergiu Birca

    Hey Jonathan,

    Here is the script.

    Before releasing it, please activate this option:

    If you won't find it in your menu, please:

    =1=

    Disable the chat option in your Web Widget Settings.

    =2=

    After 10 minutes, log out from Zopim and then log back in. That menu option should appear in the list.

     

     

    The script:

    var user_tags = HelpCenter.user.tags;
    var vip = "vip";
    if ($.inArray(vip, user_tags) === 1) {


    window.$zopim||(function(d,s){var z=$zopim=function(c){z._.push(c)},$=z.s=
    d.createElement(s),e=d.getElementsByTagName(s)[0];z.set=function(o){z.set.
    _.push(o)};z._=[];z.set._=[];$.async=!0;$.setAttribute('charset','utf-8');
    $.src='//v2.zopim.com/?account_key';z.t=+new Date;$.
    type='text/javascript';e.parentNode.insertBefore($,e)})(document,'script');


    $zopim(function() {
    setTimeout(function() {
    if ($zopim.livechat.isChatting() == true) {
    console.log("Chat is running!");
    $zopim.livechat.window.show();
    } else {
    console.log("Chat is not running!");
    $zopim.livechat.button.show();
    }
    }, 1500);

    });

    }

     

     

    the account key you can find here:

     

     

  • Avatar
    Jonathan Semones

    Hey Sergiu,

    We tweaked that script a little and got it working for us.  However, we found when we started that there was one problem.  When we click on the button the screen chat screen pops up, but when we click the collapse button on the screen it disappears instead of just collapsing down to the button again. When we got done tweaking it the problem was still there.  Any idea how to fix that?  

     

  • Avatar
    Sergiu Birca

    Hey Jonathan,

    It's because we use the Hide option. It automatically hides the widget.

    Use the onHide JS API endpoint to identify the moment when the visitor clicks to hide the chat window. Then use button.show() to display the button.

     

    Add this bit to your script:

     

    $zopim.livechat.window.onHide(show_button);

    function show_button() {
    $zopim.livechat.button.show();
    }

     

  • Avatar
    Jonathan Semones

    Hey Sergiu,

    That did it!  Thank you for all your help.  It is working perfectly now.

  • Avatar
    Soowon Lee

    Hi, This is exactly the function I'm looking for but the scripts in the comments does not work for me. If anyone can share a working script I can test with it will be much appreciated!

  • Avatar
    Gary

    Hi All,

    If I only want to show zendesk zopim livechat to signed in users, what do I need to do?

    Thanks

  • Avatar
    Sergiu Birca

    Hi Support-Mgr,

    the question is too generic. 

    What widget do you use? The Chat or the Web Widget?

    Where do users have to authenticate (the Corporate website or the Help Center)?

     

    In case if you use the Chat Widget:

    You can use the JS API endpoints we have to hide the widget by default and display it only to the right users.

    You might want to have a look  at these endpoints:

    https://api.zopim.com/files/meshim/widget/controllers/liveChatAPI/Button-js.html#$zopim.livechat.button.show

    pseudo code:

    if (authenticated)

    {

    $zopim.livechat.button.show();

    }

    else

    {

    $zopim.livechat.button.hide();

    }

     

    For the Web Widget:

    https://developer.zendesk.com/embeddables/docs/widget/api#ze.hide

     

    Also you might want to have a look at this new functionality we've released:

    Chat Authentication:

    https://chat.zendesk.com/hc/en-us/articles/360000753167-Early-Access-Authenticated-Visitors-in-Chat-Widget

     

    Hope it helps.

     

     

     

     

     

     

  • Avatar
    David

    @Sergiu,

     

    Can you please direct me how I would apply this to an organization tag called 'partner'?

     

    I tried giving my user a user tag of partner, and tested it by entering var vip = "partner"; but it didnt work!

    and i don't know how to have the script search for org tags.

     

    Thanks!

     

  • Avatar
    Sergiu Birca

    Hi David,

    If the task is to target specific organizations (based on the name), you can use this:

    if (HelpCenter.user.organizations[0].name === "Organization_name")

    {

    // do something

    }

     

     

    For Org tags, you can try:

     

    if(HelpCenter.user.organizations[0].tags.indexOf('tag_name') > -1)

     

     

  • Avatar
    David

    Thank you Sergiu, that worked very well!

  • Avatar
    David

    Zendesk, please provide an updated version of the article, so users won't have to piece together a solution from the comments.

  • Avatar
    David

    @Sergiu,

     

    I needed to change to the Web Widget, and I successfully used your code from above (https://support.zendesk.com/hc/en-us/articles/203661356/comments/207127188). However, I am having Johnathan's issue, that when collapsing the widget it disappears.

    What do I need to add to the Web Widget script to prevent this?

    Thank you so much for your help.

  • Avatar
    Sergiu Birca

    HI David,

    In the Web Widget settings => have you enabled only the Chat option?

     

  • Avatar
    David

    Indeed I have

  • Avatar
    Sergiu Birca

    Hi David,

    The short version is that if you only enabled the Chat option in the WW, in the front end it would default to the Chat widget (not the WW, as non of the other WW elements are enabled). Currently as a result of the Chat channel being enabled in the WW, the system loads the Web Widget + Chat widget in the background. Moving forward this will change (functionality currently in beta).

    In your case I would do the following:

    Have a look at this article I wrote a while back:

    https://support.zendesk.com/hc/en-us/articles/115000566208-Web-Widget-Chat-advanced-customization

    The script will give you much more flexibility in regards to combination of channels you could use as part of the WW. Even if you don't have immediate plans to release more than 1 channel (Chat), I would still advise you go this route. You will just have to set your WW key + update a couple of labels/titles/chat department name. 

    In the WW UI settings, enable both the Chat and the Contact Form options.

     

    Via the Script (the very last command):

    runWidgetLogic.init(false, true, false);

    suppress the Contact form element. As a result you will still only display the Chat channel in the widget but at this time it will display the WW UI and not the Chat Widget UI. It will make more sense after you will test this. 

    Normally this should address your show/hide problem. If not, check the logic you have around these endpoints (hide/show):

    https://developer.zendesk.com/embeddables/docs/widget/api#ze.hide

    Hope it helps.

  • Avatar
    David

    Thank you Sergiu, that sounds like a good idea, but I have a few issues, such as being able to display the widget to certain organization tags. I'm not a programmer, so I can manage with pasting code but I need some clear instructions to execute.

    I'll comment in the article you sent me to. 

     

Please sign in to leave a comment.

Powered by Zendesk