Userorbit allows you to embed interactive checklists directly into your application, providing users with guided step-by-step tasks and real-time progress tracking without leaving your product.
What are embedded checklists?
Embedded checklists are interactive task lists that appear directly within your application's interface. They help guide users through complex workflows, onboarding processes, or feature adoption by breaking down larger goals into manageable, trackable steps.
Common use cases:
User onboarding flows
Feature adoption guides
Setup and configuration tasks
Compliance and training checklists
Product tour completion tracking
How to embed a checklist
Go to Checklists in your Userorbit admin dashboard.
Select the checklist you want to embed.
Click the Embed button in the checklist settings.
Copy the generated embed code or JavaScript snippet.
Paste the code into your application where you want the checklist to appear.
Embedding options
JavaScript Widget
Best for: Most web applications
Setup: Add the provided script tag to your HTML
Customization: Full control over styling and positioning
Iframe Embed
Best for: Quick integration or restricted environments
Setup: Use the iframe URL directly
Customization: Limited styling options
Customizing the embedded checklist
Styling: Match your brand colors and fonts using CSS custom properties
Positioning: Control where the checklist appears on your page
Behavior: Configure auto-open, completion tracking, and user interactions
Responsive: Automatically adapts to different screen sizes
Advanced configuration
Targeting: Show different checklists based on user properties or behavior
Analytics: Track completion rates and user engagement
Integration: Connect with your existing user management system
Notifications: Set up alerts for checklist completion or abandonment
Best practices
Keep checklist items concise and actionable
Test the embedded checklist across different devices and browsers
Monitor completion rates to optimize checklist effectiveness
Use clear, descriptive titles and instructions
Consider user context when deciding where to place checklists
Troubleshooting
Checklist not appearing: Verify the embed code is correctly placed and your domain is whitelisted
Styling issues: Check for CSS conflicts and ensure custom styles are properly applied
Performance: Monitor page load times and optimize if necessary