> ## Documentation Index > Fetch the complete documentation index at: https://sleekplan.com/docs/llms.txt > Use this file to discover all available pages before exploring further. # Install the JavaScript widget > Add the Sleekplan feedback widget to your site with a single script tag, then optionally swap in your own trigger button and notification badges The JavaScript widget is the recommended way to embed Sleekplan in your product. Installation takes fewer than five minutes and requires only basic access to your site's HTML. Log in to Sleekplan and go to [**Settings → Widget**](https://app.sleekplan.com/settings/widget). Your personal code snippet is shown there and looks like this: ```html theme={"system"} ``` The `SLEEK_PRODUCT_ID` value is unique to your product — leave it as-is when you paste the code. Place the snippet immediately before the closing `` tag: ```html theme={"system"} ``` If you cannot edit ``, place the snippet before `` instead. If the widget does not appear on the first load, clear your browser cache and reload the page. Disable the default button in **Settings → Widget** if you want to use a button from your own UI. Then add a data attribute to any HTML element to make it open the widget: ```html theme={"system"} ``` ### Add a notification badge Add a badge attribute alongside your trigger to display an unread count: | Attribute | Shows count for | | ---------------------- | ------------------------------------------------------ | | `data-badge` | All notifications | | `data-badge-feedback` | Feedback activity (status updates, comments, mentions) | | `data-badge-changelog` | New changelog entries | ```html theme={"system"} ``` After installing, control the widget with the `$sleek` SDK — see [SDK overview](/sdk/overview), [User setup](/sdk/user-setup), and [Single Sign-On](/authentication/single-sign-on).