The BuildBetter Feedback Widget allows your users to leave you direct feedback that pipes straight into BuildBetter. You’ll gain better insight into how users feel about your product, as well as a record of their sentiments that you can use when iterating on your product. This page will walk you through how to set up the Widget, as well as some more advanced functionalities exposed via the browser API.

• Setup
• API
• Global
• Methods
• init
• identify
• on
• open
• close

Setup

To embed the BuildBetter widget in your web app or website, head over to the BuildBetter Feedback Widget Settings Page. Copy the embed script there and paste it in your app’s root HTML page or on any HTML page you wish the widget to appear on. That’s it!

API

When you use the embed script copied from the Settings page, you get anonymized user feedback with no additional configuration. However, there are a few additional features you can take advantage of with a little bit of coding to get user identification working, control widget open/close state, and listen for widget events.

Global

When using the embed script, a global object will be registered on the browser window (window.BuildBetter.FeedbackWidget) to namespace the methods specified below. Please note that this registration is not necessarily immediate, so it’s always important to check that the object exists before trying to call methods on it.

All methods (aside from init) cannot be called until init has been called at least once with your secret token. The embed script calls init with your token and widgetId for you.

Methods

init

This method allows you to manually initialize the widget with your secret key. The standalone embed script will automatically authenticate the widget in “anonymous” mode using this method, so you should never need to call it in the embed scenario.

type InitOptions = {
  token: string;
  widgetId: number;
};

type InitSignature = (options: InitOptions) => void;

identify

This method allows you to identify a customer—if the customer details provided don’t reference an existing customer, a new one will be created. Any feedback the customer leaves will be automatically linked to their profile in BuildBetter.

type IdentifyDetails = {
  identifier?: string;
  email?: string;
  first_name?: string;
  last_name?: string;
};

type IdentifySignature = (details: IdentifyDetails) => void

on

This method allows you to register event listeners for common events that may occur in the widget. See type descriptors below for the list of available events. When a callback is successfully registered, on returns a method to teardown that registration (unsubscribe).

type EventType = "open" | "close" | "feedback-creation" | "feedback-update";
type EventCallback = () => void;
type UnsubscribeFn = () => void;

type OnSignature = (event: EventType, callback: EventCallback) => UnsubscribeFn | undefined;

open

This method manually opens the feedback widget if it is closed

type OpenSignature = () => void;

close

This method manually closes the feedback widget if it is open

type CloseSignature = () => void;