Edit Layout
This article helps Skilljar Starter admins arrange, add, and remove sections of a Catalog Page so that learners view content in the intended order and format.
Overview
The Edit Layout option in Skilljar Starter enables you to visually arrange the building blocks, such as the page header, course list, banner, and supporting content sections, of a Catalog Page without writing code. Layout changes apply to the active page only, and you can preview different pages before publishing.
Use Edit Layout when you want to:
- Reorder existing sections to highlight priority content first.
- Add new sections such as banners, featured courses, or text blocks.
- Remove sections that are not relevant to your learner audience.
- Restructure the layout for a specific catalog page without affecting other pages.
How Edit Layout Works
Edit Layout opens an interactive editor on the Catalog Page. While in edit mode, each section becomes selectable and can be moved, configured, or deleted. The remaining admin toolbar options, such as Preview State, Style, Settings, and Catalog Page Settings, stay available so you can test and style your changes in the same workflow.
- Layout Mode: Toggles the page into editable mode, exposing per-section controls, including move, configure, and delete.
- Section Library: Provides reusable sections that you can use in the page.
- Live Preview: Reflects layout updates in the working canvas before they are published to learners.
Edit a Catalog Page Layout
To open the layout editor and modify a Catalog Page:
- Open your Skilljar Dashboard.
- Navigate to the Catalog Page you want to edit.
- In the admin toolbar at the bottom of the page, click Edit Layout. The Edit mode page appears.
- Use the following widget controls to make your changes:
- Move a widget: Use the arrow to move the widget.
- Add a section: Click the add icon between sections and choose a section type from the library.
- Configure a section: Select the section to use configuration options such as title, description, or linked content.
- Delete a section: Select the section and choose delete.
- Click Publish to save your layout changes.
