$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?

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.

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);