You can customize Notiondesk Messenger to match your brand and decide what visitors can access from the widget.
Messenger customization includes its colors, launcher, layout, home screen, support modules, languages, and allowed website domains.
Customize colors and branding
Use the Messenger appearance settings to match Messenger with your website or application.
You can customize colors used throughout Messenger, including:
- Primary color
- Background color
- Text colors
- Header colors
- Launcher colors
- AI and visitor message colors
- Input colors
You can also configure the fonts used inside Messenger.
These branding settings are controlled from Notiondesk rather than through the JavaScript SDK.
Customize the Messenger launcher
The launcher is the button visitors use to open Messenger.
You can customize:
- Whether the launcher is displayed
- Launcher position
- Launcher shape
- Side spacing
- Bottom spacing
- Launcher colors
- Custom launcher icon
Change the launcher position
Messenger can appear in either bottom corner of your website:
- Bottom right
- Bottom left
Choose the position that avoids overlapping your website navigation, cookie controls, accessibility tools, or other floating elements.
Change the launcher shape
The launcher can use:
- Rounded square
- Circle
Choose the shape that best matches your interface.
Use a custom launcher
You can hide the standard Notiondesk launcher entirely and open Messenger from your own interface.
For example, you could open Messenger from:
- A Help button in your navigation
- A Contact support button
- Your account menu
- A floating button you already use
- A support section inside your application
Turn off Show launcher in your Messenger configuration, then use the Notiondesk Messenger JavaScript SDK to open or toggle Messenger.
For example:
helpButton.addEventListener("click", () => {
void notiondesk.toggle();
});See Control Notiondesk Messenger with the JavaScript SDK for custom launcher examples and SDK controls.
Choose the default Messenger layout
Notiondesk Messenger supports different layouts depending on how you want support to appear inside your product.
Available layouts include:
- Floating: Messenger opens as a floating panel above your website
- Sidebar: Messenger opens as a full-height side panel
- Full screen: Messenger uses the available viewport
Configure the default layout from your Messenger settings.
Messenger also adapts automatically to smaller screens so visitors can use it comfortably on mobile devices.
Choose which Messenger modules are available
Messenger can contain several support modules.
| Module | Purpose |
|---|---|
| Home | Custom starting screen with support content and shortcuts |
| Messages | AI-powered support conversations |
| Help | Browse and search your help center |
| Contact | Contact your support team |
| Changelog | View your latest product updates |
Enable only the modules that make sense for your support experience.
Messages
The Messages module provides AI-powered conversations inside Messenger.
A Notiondesk AI Chatbot must be connected and configured for this module.
Visitors can use Messages to ask questions and receive answers based on your support content.
Help
The Help module gives visitors access to your help center without leaving your website.
Visitors can browse categories, open articles, and search your documentation directly inside Messenger.
Contact
The Contact module gives visitors a way to contact your team when self-service support is not enough.
Changelog
The Changelog module surfaces your published product updates directly inside Messenger.
This lets customers discover new features and improvements without leaving your application.
Customize Messenger languages
Configure which languages are available in Messenger and choose its default language.
Only languages enabled for the Messenger can be selected by visitors.
If your application already knows the visitor's preferred language, you can also set Messenger's language programmatically with the JavaScript SDK:
notiondesk.setLanguage("fr");The requested language must also be enabled in the Messenger configuration.
See Control Notiondesk Messenger with the JavaScript SDK for runtime language synchronization.
Restrict Messenger to trusted domains
You can restrict your Messenger so it only loads on approved website domains.
Use trusted domains when Messenger should only be embedded on websites and applications you control.
For example, you could allow:
www.example.com
app.example.comWhen trusted domains are configured, Messenger will not load from an unauthorized website.
This is especially useful when Messenger exposes customer support features intended only for your own application.