Learn how to embed interactive checklists directly into your application, providing users with guided step-by-step tasks and progress tracking.
Embed a checklist into an existing element in your application by targeting that element with a CSS selector.
The selector must resolve on the pages where the checklist is shown. If the checklist does not appear, confirm the SDK is loaded, the checklist is published and targeted to the current user, and the selector matches exactly.
- Install and initialize the Userorbit SDK on the page.
- Add an empty container where the checklist should appear. Give it a stable ID or data attribute.
- Open the checklist in Userorbit and select Edit.
- In Design, open Advanced and enable the embed option.
- Enter the container's CSS selector, such as
#onboarding-checklist. - Preview and publish the checklist.
The selector must resolve on the pages where the checklist is shown. If the checklist does not appear, confirm the SDK is loaded, the checklist is published and targeted to the current user, and the selector matches exactly.
Userorbit does not generate an iframe URL or checklist-specific script snippet. Embedding uses the installed SDK and a CSS selector.