Course pages

Create a series of guided lessons to offer visitors seeking your expertise.

Build a course page to teach your visitors a new skill, guide them through a project, or otherwise share your expertise. To sell access to your course, add it to a pricing plan.

This guide covers the basics of course pages, how to add one to your site, and customizing your course page.

Course pages are only available on version 7.1.

Tip: Register for our Create and sell online courses with Squarespace webinar. We’ll provide guidance on preparing a curriculum, building an online course, and monetizing your courses with pricing plans.

Course page structure

Course pages have a two-part structure: the course overview page and the individual lesson pages in the course. There are a few other elements to a course page, including chapters and the progress bar.

Tip: You can include images, text, forms, and more by adding page sections to both the course overview page and lesson page.

Course overview page

The course overview page is the homepage for your course. It displays the course description, a Start course button, a progress bar, and the chapters and lessons of the course. You can add sections to the course overview page to outline the content included. 

If the course overview page is in your main navigation section of the Pages panel, it’s visible to all your visitors.

Lesson pages

The lesson page displays the content of the lesson, and a Complete and continue button. Clicking Complete and continue takes visitors to the next lesson and updates the progress bar on the course overview page.

Lesson pages can only be viewed by visitors that sign up for the course and log into their account.

Chapters

Chapters hold lesson pages and their title displays on the course overview page. They’re an optional addition to your course page.

Progress bar

The progress bar tracks how much of the course a visitor has completed. As visitors complete lessons, the progress bar reflects their progress percentage.

While you’re editing the site, the progress bar shows 0%. To test the progress bar, preview the page, work your way through the course, and watch the progress bar update.

Add a course page

To add a course page:

1. Open the Pages panel. 
2. Click + beside the navigation section where you want the course page to appear.
3. Under Collections, select Course.
4. Select the layout you want.
5. Enter a page title, then press Enter.

After adding the course page, the course overview page shows on the right side of your screen.

Course page settings

Edit the course page settings to personalize your page:

1. In the course page panel, click .
2. Change the page settings, including the course page specific settings:
   • Course name - The title that appears in the browser tab
   • Course summary -  A description that appears when the page is linked elsewhere 
3. Click Save.

Add lessons

Lessons are the course content. They include videos, and page sections with images and text. You can add up to 250 lessons per course page.

To add a lesson to your course page:

1. Open the Pages panel. 
2. Click the course page where you want to create a lesson.
3. In the course page panel, click Course Content, then click +. 
4. In the drop-down menu, select Lesson.
5. In the General tab, enter a title for the lesson. Titles must be 200 characters or fewer.  You can also add and edit these optional features:
   • Excerpt - A short description of your lesson. This displays on the course overview page and in summary blocks. We recommend keeping your description to 500 characters or fewer.
   • Custom URL - We assign a URL that matches your lesson’s title. You can edit this URL.
   • Thumbnail - Add an image that represents the lesson. This displays on the course overview page and in summary blocks.
6. In the Video tab, you can add a video to your lesson. If your lesson doesn't include a video, or if you want the top of your lesson to be a page section instead, switch the Show lesson video off.
7. If your lesson includes a video, click Add a video, then: 
   • To upload a video file directly to your site, click Upload File.
   • To reuse a video you’ve previously uploaded, click Select from library.
   • To embed an externally hosted video, click Add from link, and paste a Vimeo or YouTube video link.
8. In the Status tab, click to Publish or Schedule the lesson to publish. You can also leave the lesson as a Draft to continue working on it.
9. Click Save.
10. Click Edit in the top-left corner, then add page sections that include your lesson’s content.

Tip: Review our image best practices to create an engaging thumbnail image.

Lesson page videos

A lesson page video displays at the top of the page like a banner. You can add one lesson page video to each lesson page. To add more videos, add video blocks to the block areas on the page.

If you didn't add a video when you created the lesson page, follow these steps to add a lesson page video to an existing lesson page:

1. Open the Pages panel and click the course page. 
2. Click Course Content.
3. Hover over the lesson where you want to add the video, click ..., then click Edit Lesson.
4. Click Video, then click Add a Video to upload a video, add a video previously uploaded to your library, or embed a video from a third-party service.
5. Click Save.

 Custom featured image

If you upload a video, you can add a custom featured image that overlays the video before it plays. 

To add a custom featured image:

1. After the video uploads, switch the Custom featured image toggle on.
2. Click Add an image.

Keep in mind, this option is only available for videos uploaded to Squarespace. Embedded YouTube or Vimeo videos pull their featured image from the third-party service.

Lesson page video storage limits

Videos added to the lesson page’s Video tab can be up to three hours long, storage allowing. To learn more about video requirements, visit Adding videos to your site.

Every Squarespace site comes with 30 minutes of video storage across all pages and uploaded videos. For more video storage, consider purchasing a Digital Products plan.

Add a chapter (optional)

Chapters help organize your course content by grouping lessons together. Visually, chapters connect similar or sequential lessons. You can add up to 250 lessons to a chapter.

To add a chapter to your course page:

1. In the course page panel, click Course Content, then click +. 
2. In the drop-down menu, select Chapter.
3. The new chapter is now in your course page panel. Hover over New Chapter and click …, then enter your chapter title. Chapter titles must be 200 characters or fewer.
4. Click Save.
5. Click and drag lessons into your chapter.

Organize lessons and chapters

Lessons and chapters appear on your course overview page based on the order they’re listed in the course page panel. You can click and drag lessons in or out of chapters, or into a different order. You can also click and drag chapters to be in a different order. 

Style a course page

Colors and fonts on the course page follow your site-wide font and color tweaks. To access the styles for the course overview page or the lesson page:

1. Click Edit on the course overview page or lesson. 
2. Click Edit Layout to open the course overview or lesson page style settings.

Style the course overview

After clicking Edit Layout to open the style settings on the course overview:

1. Click Elements to choose what elements are visible or hidden on the course overview, including Course Title, Course Description, Course Button, Lesson Thumbnails, and Lesson Excerpts.
2. Click Design to change the course overview's spacing, alignment, button styles, layout, and more.
3. Under Layout in Design, select List or Grid. In the list layout, lessons display in one column as a vertical list. In the grid layout, lessons display in rows to create a grid.
4. Click Colors to choose a color theme for the course overview.

Keep in mind, the list and grid layouts have different style options. For example, you can change the lesson thumbnail aspect ratio in the list layout, but not the grid layout.

Style lesson pages

After click Edit Layout to open the style settings on a lesson page:

1. Click Design to change the lesson page thumbnail display, button styles, alignment, and spacing, and to enable and style a divider between sections on the lesson page.
2. Click Colors to choose a color theme for the lesson page.

The style changes you make affect all lesson pages in your course page. This is to ensure consistency in the style and design.

Sell access to your course page

You can sell access to your course using pricing plans. You can also offer free pricing plans and require visitors to provide their email address.

When you add a course page to a pricing plan, you can hide the entire course page behind a paywall, or only the lesson pages. If you hide only the lesson pages, the course overview page will be accessible by all visitors to your site.

Tip: Add a digital product block to your course overview page to encourage your visitors to sign up.