Provide frictionless support straight from your product, with Messenger. Aside from the live chat, Messenger allows your customers to view help articles, access changelog updates, submit feedback, and much more.

Installation

The widget can be installed using our JavaScript SDK. Here are some examples of popular JavaScript frameworks:

Example
HTML
NextJS
VueJS
Svelte
Copy
<!-- 1. Load the Featurebase SDK -->
<script>!(function(e,t){var a="featurebase-sdk";function n(){if(!t.getElementById(a)){var e=t.createElement("script");(e.id=a),(e.src="https://do.featurebase.app/js/sdk.js"),t.getElementsByTagName("script")[0].parentNode.insertBefore(e,t.getElementsByTagName("script")[0])}};"function"!=typeof e.Featurebase&&(e.Featurebase=function(){(e.Featurebase.q=e.Featurebase.q||[]).push(arguments)}),"complete"===t.readyState||"interactive"===t.readyState?n():t.addEventListener("DOMContentLoaded",n)})(window,document);</script>

<!-- 2. Boot Featurebase with your messenger config -->
<script>
  Featurebase("boot", {
    appId: "YOUR_APP_ID_HERE",         // required
    email: "user@example.com",         // optional, requires secure installation by default
    userId: "12345",                   // optional, requires secure installation by default
    createdAt: "2025-05-06T12:00:00Z", // optional
    theme: "light",                    // "light" or "dark"
    language: "en",                     // short code (e.g. "en", "de", etc.)
    // Hide the launcher button entirely
    // For custom launcher button implementation
    // hideDefaultLauncher: true // optional
  });
</script>

Field descriptions

Here’s a list of all the main parameters you can include inside the boot function:

• appId - (Required) Your Featurebase organization ID (not name), which can be found here.

• email - User’s email address.

• userId - The user’s unique ID in your application.

• createdAt - When the user’s account was created.

• theme - If the dark or light theme of the widget should be shown.

• language - The language of the widget, you can check available languages from Localize Featurebase to work with multiple languages

• hideDefaultLauncher - Hide the default launcher button, to open or close the widget only programmatically.
  Messenger Javascript API - Methods

Adding custom data about the user

You can include any custom data you want in the boot function as long as the required parameters are set.

This means you can add params like userPlan, userSubscriptionId, etc.. all in the same object. You can even add more complex nested parameters.

Leaving out user data

If you’d like to treat the communicating user as a lead instead, you can remove userHash and all other user identifying data.

Next steps

• Set up & customize the Messenger – customize the branding and settings of Messenger

• Set up email forwarding – receive and answer customer emails from your Featurebase Inbox

• JavaScript API – for more advanced configuration and to trigger events

FAQ