# Hide web chat icon
## Why hide the web chat icon and use a custom launch event?
If the Mava web chat icon is blocking content on your website for desktop or mobile users you can hide it by default and add a custom launch event as outlined in the previous section. This enables you to configure the Mava web chat to only open if, for example, a user presses a button or link on your site.
#### Advantages:
* Chat icon will no longer be blocking content on your site
* Can be configured so the chat icon is only hidden on mobile devices, but remains visible on larger screens
#### Disadvantages:
* With a less prominent support icon, users may find it harder to contact your support team
* You'll have to [manually configure an unread message icon](#how-to-display-unread-message-notifications) to alert users to new unread messages
* We recommend using the Mava SDK or 'Request users email' setting to capture the users details so they receive a response via email if they abandon the chat before your team replies.
* Requires developer resources, implementation time c.10-30 minutes
**Method**
To hide the launcher add `data-hide-mava-launcher="true"` to existing widget script that should be within your website \ element.
<script src="https://widget.mava.app" data-hide-mava-launcher="true" />
The most common use case for this is for use on responseive sites when the screen size is smaller (e.g mobile view) and screen real estate is limited.\
\
For example you can construct the script element as outlined below, ensuring that the launcher is only displayed on screens greater than 768px in width.
```html
const script = document.createElement('script');
script.id = 'MavaWebChat';
script.setAttribute('widget-version', 'v2');
script.setAttribute('data-token', 'YOUR_TOKEN');
var windowWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
if (windowWidth < 768) {
script.setAttribute('data-hide-mava-launcher', 'true');
}
window.document.head.appendChild(script);
```
Combining the with custom launch events from the previous section, you can hide the Mava web chat icon on mobile and use a custom launcher instead, giving you a lot of flexibility on how you use the widget.
### How to display unread message notifications
If you choose to hide the default web chat launcher, users won’t see the unread message indicator when your team responds, provided their chat window is closed.
To address this, you can use the following functions to both retrieve the current unread message count and register a callback function that triggers when the unread message count changes
*Retrieves the current unread messages count:*
```
window.MavaGetUnreadMessageCount
```
*Registers a callback function to execute when there’s a change in unread message count:*
```
window.MavaRegisterUnreadNotificationCallback
```
---
# Agent Instructions: Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://mava.gitbook.io/mava-docs/getting-started/integration-setup/web-chat-setup/hide-web-chat-icon.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.