English (US)
  1. Zendesk help
  2. Web Widget
  3. Web Widget advice and troubleshooting

How can I enable or disable certain Web Widget (Classic) components on different pages of my site?

Sergiu Birca
  • Edited
Disclaimer: This article is provided for instructional purposes only. Zendesk does not support or guarantee the code. Please post any issues you have in the comments section or try searching for a solution online. 

Question

How can I enable or disable combinations of Web Widget (Classic) components on different pages of my site?

Answer

This can be achieved by using our set of Web Widget (Classic) API endpoints to suppress the Help Center Search, Chat and Contact Form component. All the Web Widget (Classic) endpoints are also explained and documented in Advanced customization of the Web Widget (Classic).

This script can help easily enable or disable various combination of components depending on necessity.

What it does:

  • Uses the Web Widget (Classic) script that can be placed either directly on the page, or with Google Tag Manager (GTM).
  • Uses various API endpoints that will allow customers to customize various titles used on both Web Widget (Classic) and Chat windows.
  • Uses the suppress API endpoints that allow us to deactivate specific components.
  • Uses Chat department routing depending on the status of the department.

The actual script:

To enable or disable a component, just change the relevant parameter in the runWidgetLogic.init function. 

Examples:

  • If you want to enable only the search option, use: runWidgetLogic.init(true, false, false); 

 

  • To enable search and contact form use: runWidgetLogic.init(true, false, true);

  

  • To enable only Chat: runWidgetLogic.init(false, true, false);
     

 

Elements in the code that will have to be updated:

  • document.zendeskHost = 'mycompany.zendesk.com' => update "mycompany" with your subdomain);
  • 'Department Name'  => update with the name of your Zendesk Chat department.
  • The titles or labels names used in the script can be updated on necessity. 

To easily release the solution on a website, place the code (except for the runWidgetLogic.init(true, false, false); line) in a file (.js). Then, add the code in the header section of the web page and then call the function via Google Tag Manager or directly in the web page by using a certain conditionality.

Return to top

6 Comments

  • Katie Welzbacher

    How do I add Wed Widget Classic as a Google Tag? 

    0
  • Dave Dyson

    Hi Katie - we've got some documentation on that here: Adding the Web Widget (Classic) via Google Tag Manager

    0
  • Flisekompaniet AS

    Hi. Im planning to implement Zendesk Chat using Google Tag Manager.

    But, an issue - I have a couple of URLs I dont want the chat to show on. 

    Is there a way to add "not show chat if url contains "12345"? 

    How do I do this? Is it something I add to the script in GTM? 

    0
  • Miranda Burford
    Zendesk Product Manager

    Hi @...,

    There's a couple of ways you could solve for this.

    1. You could set conditions within Google Tag Manager to not load the Web Widget code snippet on the URLs where you don't want it to show.
    2. Alternatively, you could load the Web Widget code snippet on all pages and use the Web Widget Hide API to remove it from those URLs.

    Hope this helps!

    - Miranda.

    0
  • CJ Johnson

    "or directly in the web page by using a certain conditionality." What does this mean? I'm just trying to suppress chat on a specific set of HC pages, and I just cannot seem to figure out how to make this happen. 

    0
  • Eric Nelson
    Zendesk Developer Advocacy
    Hey CJ,
     
    I think what they're referring to in this article is leveraging DOM events or something similar to track where you are in the help center. Then using that info to show or hide the widget components.
     
    For example:
     
    if (window.location.pathname == '/examplePage'){
//Some logic to hide certain components}
else {//Some different logic}
    0

Please sign in to leave a comment.

Related articles

Powered by Zendesk