# Managing Chat Widget state
You can programmatically control the visibility and state of the User.com Chat Widget using the userengage function. This allows you to hide the widget on specific pages, expand it automatically based on user actions, or close it when needed.
# Method signature
userengage("widget.{{state}}");
state(String): The desired state of the widget (e.g.,'hide','open').
# Available states
You can trigger one of the following states:
| Command | Description |
|---|---|
userengage("widget.hide") | Completely hides the widget launcher button from the page. |
userengage("widget.show") | Shows the standard widget launcher button (if it was previously hidden). |
userengage("widget.open") | Automatically expands the chat window (simulates a user clicking the launcher). |
userengage("widget.close") | Closes (minimizes) the chat window if it is currently expanded. |
# Implementation examples
# Example 1: Hiding the widget on specific pages
If you want to prevent the chat widget from appearing on your checkout page to reduce distractions:
// Run this after the SDK has loaded
if (window.location.pathname === '/checkout') {
userengage("widget.hide");
}
# Example 2: Opening chat on button click
You can bind the widget to a custom "Contact Support" button on your site.
document.getElementById('contact-btn').addEventListener('click', function() {
userengage("widget.open");
});