Before your visitors can start chatting with you, you’ll need to add the widget to your site by embedding the widget script in the HTML source code of one or more pages.
To add the live chat widget to a web page
- From the dashboard, select Settings > Widget, then click the Getting Started tab.
- Copy the embed script, as shown in the example below:
- In the source code of the web page, paste the embed script between the page's head tags.
You can paste it either right after the opening <head> tag or right before the closing </head>.
If you are concerned about page load performance, we recommend instead placing the snippet at the end of the <body> rather than the <head>. Even though the snippet script is very lightweight, it’s best to avoid inserting scripts that will block the browser from continuing to render a web page until that script has loaded. Just keep in mind that any scripts that use the Web Widget zE JavaScript API must be placed after the snippet script. - Save and publish the page.
The widget should be visible after reloading the page in a browser.
42 Comments
How do you get the chat widget on every page of your website?
Hey there Sarah Snyder,
You just need to use the same script for all your website pages. Also, you will see which website a visitor is from based on the URL displayed on the Visitor list and the active chat window.
You can refer to this article for the complete instruction on how to install Zendesk Chat on multiple websites: How can I use Zendesk Chat on multiple websites?
is it possible to embed several different zendesk chat accounts on the same website?
For example, I website contain three different companies webpage, I would like to create 3 different zendesk accounts and embed to different webpage.
Hi Chan,
This is possible, although you have to make sure that the widgets are positioned differently so that they don't overlap. It can confuse users if there are multiple widgets though. If you're supporting multiple companies on one web page the simplest option might be to set the different companies up as departments within one chat account, and then the customer can select which department they want to talk to when interacting with the widget.
Hi,
On my ionic mobile, I don't want to show the floating chat widget (as it will conflict with other elements), but to place it as an item. Is there any way to do that?
Thanks
Hi Ivan.
Thanks for reaching out!
May i have a look at your mobile view of the widget? can you send a screenshot? Also, you can rather overlay the widget on your mobile device following this article: Recipe: Identify and track what webpage a customer was on when they started a chat
Ivan Miquiabas | Customer Advocate
HI Zendesk / Zopim Chat Team,
We are working on improving our website speed. Often the page speed tools suggest that the Zopim JavaScript can be compressed more. Is the something we can download, compress and embed locally from our own domain? Or do you have an updated version that is faster?
Here's a screenshot example:
Hi Scott Stawarz,
I agree, Zendesk needs to redo the widget in a lighter fashion. It hits our Google rankings because it slows down the page. Our workaround until Zendesk fixes this (Zendesk, why not fix it??) is to load an image that looks like chat, and when the customer clicks it, we redirect them to a deeper page in our website to load the actual chat.
Terrible, right? But we didn't want our main page to get "dinged" by Google.
Hi Ramin,
Thank you so much for helping. I was wondering about how I can hide widget from website, but thanks you shared API source https://api.zopim.com/files/meshim/widget/controllers/LiveChatAPI-js.html#hideAll
It works for me. Thanks,
hey
is it possible to use it in 2021 for my current website Jazz daily Internet Package, I wanna add a chat box to my website please guide me a little bit..
----
This post has been edited by the Zendesk Community Team, to remove links, in order to meet with our Community Guidelines.
Hi Muhammad!
Thanks for your interest! If you haven't already, first you'll want to register for a trial: Register
Once you've done that, this article will take you step by step through the process of trying out chat and setting it up in your Zendesk help center: Evaluating live chat in your Zendesk Suite trial account
Once you've done that, come back to this article and follow the directions above. You'll need to be able to edit the HTML on your Jazz Packages website in order to embed the chat widget there.
And if you run into any issues as you go, here's how to contact our support team: Contacting Zendesk Customer Support
Hope that helps!
Please sign in to leave a comment.