$zopim is not defined

Question

Reading the documentation of Zopim (a.k.a Zendesk Chat):

API calls must be inserted after the Live Chat Script and wrapped within $zopim(function() { ... })

So I have a the Zopim script in head part of HTML:

<script>/*<![CDATA[*/window.zEmbed||function(e,t){ ... }("https://...);
/*]]>*/</script>

Then I added this at the end of HTML document:

$zopim(function() {
  $zopim.livechat.setName('Logged in name');
  $zopim.livechat.setEmail('[email protected]');
});

And console says:

$zopim is not defined

I think I have followed the instructions correctly. What did I miss?

Stephniestepladder

Did you solve this? I have the same issue exactly – Eunuchize

No. I wrote an ugly hack with a timeout, I will post it as an answer – Stephniestepladder

Answer 1

I've found a better solution (after submitting a request to support)

    zE(function() {
        $zopim(function() {
            $zopim.livechat.setName("{{\Auth::user()->name}}");
            $zopim.livechat.setEmail("{{\Auth::user()->email}}");
        });
    });

I was using a Zendesk Chat Code within Zendesk Support that is why I need to add Ze function to make it working using api.

Edit: check the interesting comment from Jay Hewitt and also his answer on this question.

Maniacal

This depends on how you're embedding the javascript. If you're using the $zopim javascript this won't work, but if you're using the Zendesk Widget (zEmbed) then you still have an issue of zE (or zEmbed) not being loaded before this is run, so even in this instance, you need a wait loop. – Andre

thanks @Freefri, this resolved error but in my case widget not showing on Chrome, on Firefox it shows after first load. I am using with Angular 8 – Helaine

Answer 2

This will loop, waiting for $zopim and $zopim.livechat to be loaded. Once they're loaded it will stop looping.

var waitForZopim = setInterval(function () {
    if (window.$zopim === undefined || window.$zopim.livechat === undefined) {
        return;
    }
    $zopim(function() {
        $zopim.livechat.setName("{{\Auth::user()->name}}");
        $zopim.livechat.setEmail("{{\Auth::user()->email}}");
    });
    clearInterval(waitForZopim);
}, 100);

Andre