How to hide the chat icon and trigger the chat with a link or button

If you want the chat window to stay hidden until someone clicks a specific link or button, we've got you covered.

Here's how to set it up:

1. Add the ID to your element
   On your site, locate the button, link, or any other element where you want users to click to open the chat. Then, add the following ID to that element:

   id="commslayer-widget-toggle"
   
   

2. Example HTML code
   Here's an example of how it might look for a button:

   <button id="commslayer-widget-toggle">Chat with us</button>
   
   

   Or for a link:

   <a href="#" id="commslayer-widget-toggle">Open Chat</a>
   
   

3. What happens next

   • On a page that has an element with this ID, the chat icon is hidden.

   • A click on that element opens the chat window. While the chat window is open the icon is shown, so the visitor can close it again.

   • The element has to be in the page's HTML when the page loads. Use the ID once per page.

That's it. Simple, right?

Just want to hide the widget on certain pages?

If you don't want a custom trigger and just want to keep the chat off pages like landing pages, product pages or the cart, see How to hide the chat widget on specific pages. You just add a hidden element with the same ID to the pages or templates where you want the widget gone.