---
title: "JavaScript SDK: Checklists"
description: "Display onboarding checklists for your users with the Gleap JavaScript SDK. Follow the integration code examples."
url: https://docs.gleap.ai/en/articles/430-javascript-sdk-checklists
collection: "Widget apps"
updated: 2026-11-01
language: en
---

# JavaScript SDK: Checklists

Display onboarding checklists for your users with the Gleap JavaScript SDK. Follow the integration code examples.

Dive into a completely refreshed onboarding experience that will guide your users with gusto. The new checklist feature not only ensures your users are thoroughly onboarded but also keeps them deeply engaged. All of this is neatly packed inside our Gleap widget!

## Open the checklists overview

Open the checklists overview with the method below.

```js
Gleap.openChecklists();
```

## Manually start a checklist

Checklists can be sent either through trigger rules or manually with the method below.

```js
Gleap.startChecklist("outboundId");
```

You can find the outboundId within the checklist editor.

> **Info:** Please note that SDK version 12.1.0 or higher is required to send checklists.

## Start a checklist from a link or button

If you want a checklist to start when someone clicks a link or a button, you can use a `gleap://` link instead of writing any JavaScript. Gleap picks these links up automatically wherever the SDK is loaded:

```html
<a href="gleap://checklist/OUTBOUND_ID">Start checklist</a>
```

Replace `OUTBOUND_ID` with the outboundId from the checklist editor. The same format works for other Gleap content:

```html
<a href="gleap://tour/PRODUCT_TOUR_ID">Start product tour</a>
<a href="gleap://survey/SURVEY_ID">Open survey</a>
<a href="gleap://article/ARTICLE_ID">Open help article</a>
<a href="gleap://news/NEWS_ID">Open news article</a>
```

Because it is a plain link, you can also paste it into the link field of any rich text editor — including help center articles — rather than adding a script.

> **Info:** Unlike product tours, checklists have no `gleap_checklist` URL parameter. Use the `gleap://checklist/...` link above to start a checklist from a click.

## Get checklist data

Retrieve checklist data programmatically using the checklist ID and project identifier.

```js
Gleap.getChecklistData("outboundId", "sharedKey").then((data) => {
    console.log(data);
});
```

The sharedKey is optional.

## Listen for checklist events

You can listen to various checklist events to track user progress and interactions.

### Checklist loaded event

```js
Gleap.on('checklist-loaded', (data) => {
  console.log('Checklist loaded:', data);
});
```

### Step completed event

```js
Gleap.on('checklist-step-completed', (data) => {
  console.log('Step completed:', data.stepId);
});
```

### Checklist completed event

```js
Gleap.on('checklist-completed', (data) => {
  console.log('Checklist completed!');
});
```

## Related

- [JavaScript SDK: Conversations](https://docs.gleap.ai/en/articles/425-javascript-sdk-conversations.md)
- [JavaScript SDK: Feature requests](https://docs.gleap.ai/en/articles/426-javascript-sdk-feature-requests.md)
- [JavaScript SDK: Help center](https://docs.gleap.ai/en/articles/427-javascript-sdk-help-center.md)
- [JavaScript SDK: Release notes & news](https://docs.gleap.ai/en/articles/428-javascript-sdk-release-notes-and-news.md)
- [JavaScript SDK: Surveys](https://docs.gleap.ai/en/articles/429-javascript-sdk-surveys.md)