Preview Catalog Page States
This article explains how to use Preview State to test how a Catalog Page appears to learners in different enrollment and progress scenarios.
Overview
The Preview State option in the Skilljar Starter admin toolbar lets you simulate the Catalog Page as it would appear for learners at different stages of their learning journey. This is essential because a Catalog Page can render very differently depending on whether a learner has any enrollments, is mid-way through a course, has a mix of progress states across multiple courses, or has completed everything.
Previewing each state before publishing helps you confirm that empty states, progress bars, completion badges, and call-to-action text all behave as expected.
Preview Different Learner States
To preview a Catalog Page in a specific learner state:
- Open your Skilljar Dashboard.
- Navigate to the Catalog Page you want to preview.
- In the admin toolbar at the bottom of the page, click the Preview State dropdown.
- From the dropdown, select one of the following states:
- No enrollments: Renders the page as it appears for a learner who has not yet enrolled in any course. Use this state to check the empty-state messaging, default banners, and any onboarding prompts.
- One item in progress: Renders the page as it appears for a learner who is currently working through a single course. Use this state to verify in-progress indicators, resume buttons, and progress percentages.
- Items in mixed progress states: Renders the page as it appears for a learner with multiple courses in different stages, for example, one completed, one in progress, and one not started. Use this state to verify that the page handles complex progress combinations correctly.
- Multiple items completed: Renders the page as it appears for a learner who has finished multiple courses. Use this state to verify completion indicators, certificates, and any post-completion messaging or recommendations.
- Change the Preview State to switch between states and validate each scenario.
Note: Preview State is a simulation. It does not enroll the admin user or change any learner data. It only renders the page as it would appear for a learner matching the selected scenario.