Courses : Course Elements for Themes and Lessons

Course Elements for Themes and Lessons

In this article, we will be going over the Course elements and which Theme template pages they should be included on. We will ensure that various aspects of your course, i.e., the Video, Image, Audio, Sub-modules, etc., are displayed where they need to be so that members can view and access content easily.

Prior to getting started, you will need to have the following:

• A Live Customer Center.
• A Published Course.
• A Published Course Module.
• A Published Course Lesson.
• (Optional) A Published Course Sub-module.

Customer Center

The Customer Center is where your members will sign in to access the courses they are enrolled in.

For the courses to be displayed in the Customer Center, you must include a Course Collection element on the page.

1. To customize your Customer Center page, open the Editor and click on the Customer Center theme page.
   
   
2. Add a new element, find the Collection element directly under the Course elements section, and add it to the page.
   
   

Each square on the Course Collection element will represent a course. Not all these squares will necessarily be visible on the live page; they will be automatically populated, as needed, with each course starting from the top left.

You will need to customize the Course Collection element to include the information you want to display about the courses. For example, you can include the course Thumbnail Image by adding a Course Image element inside the Course Collection element. The most important thing you will need to include is the Course Link element so members can click on the link to access the course. Feel free to include other Course elements, such as the Course Title element.

Note: Make sure you use the elements directly in the Course section to automatically populate that information about a course.

As a finishing touch, you could configure the Course Collection element to only display courses the user is enrolled in. Otherwise, users will see all of your courses but get an error message if they try to access a course they are not enrolled in.

Course Home

This is the starting page for your courses.

All of your courses will use this theme template page to display the top-level modules of your course. To accomplish this, you must ensure the Module Collection element is on this page.

1. To customize your Course Home page, open the Editor and click on the Course Home theme page.
   
   
2. Add a new element, find the Collection element directly under the Course: Modules elements section, and add it to the page.
   
   

Like the Course Collection element discussed previously, each square on the Module Collection element will represent one of the course’s top-level modules. Not all these squares will necessarily be visible on the live page; they will be automatically populated, as needed, with each top-level module starting from the top left.

Like before, you will need to customize the Module Collection element to include the information you want to display about the modules. For example, you can include the module Thumbnail Image by adding a Module Image element inside the Module Collection element. The most important thing you will need to include is the Module Link element so members can click on the link to access the module. Feel free to include other Module elements, such as the Module Title element.

Note: Make sure you are using the elements directly in the Course: Modules section to have that information about a module automatically populated.

Module Lessons

This page is displayed when a member clicks on a Module or submodule in your course.

This page shows which lessons are available directly within the module. It also shows any submodules you have added directly beneath it.

To accomplish that, it’s important to have the Lesson Collection element and, if you’re using submodules in your course, the Module Collection element added to this page.

1. To customize your Module Lessons page, open the Editor and click on the Course Home theme page to expand the section.
   
   
2. Click on the Module Lessons theme page.
   
   
3. Add a new element, find the Collection element directly under the Course: Lessons elements section, and add it to the page.
   
   
4. If you are using submodules in your course, add another new element, find the Collection element directly under the Course: Modules elements section, and add it to the page as well.
   
   

Like the Course Collection and Module Collection elements discussed previously, each square on the Lesson Collection element will represent one of the module’s lessons. Not all of these squares will necessarily be visible on the live page; they will be automatically populated, as needed, with each lesson starting from the top left.

You will need to customize the Lesson Collection element, just like you customized the other Collection elements so that it includes the information you want to display about the lessons. For example, you can include the lesson Thumbnail Image by adding a Lesson Image element inside the Lesson Collection element. The most important thing you will need to include is the Lesson Link element so members can click on the link to access the lesson. Feel free to include other Lesson elements, such as the Lesson Title element.

Note: Make sure you are using the elements directly in the Course: Lessons section to have that information about a lesson automatically populated.

The Module Collection element was discussed in the section above when we added it to the Course Home page. It is customized and functions the same way here. The reason it is important to also include the Module Collection element on this Module Lessons page is that, similar to how it displays the top-level modules when you are on the Course Home page, it allows each Module page to display submodules that are added beneath itself. Without this element on the Module page, members would be unable to find any submodules.

Reminder: Make sure you are using the elements directly in the Course: Modules section while editing the Module Collection element to have that information about a submodule automatically populated.

Lesson Page

The Lesson Page is used as a template to display individual lessons.

1. To customize your Lesson Page, open the Editor and click on the Course Home theme page to expand the section.
   
   
2. Click on the Lesson page theme page.
   
   

This page will be displayed when a member selects a lesson. Most people will find the Lesson Title as an important element to add here. Suppose the lesson you created has a Thumbnail Image, Video, or Audio file in its settings. In that case, you can have that displayed on the page by adding a Lesson Image, Lesson Video, or Lesson Audio elements. Not the regular image, video, and audio elements.

Important: Make sure you are using the elements directly in the Course: Lessons section to have that information about a lesson automatically populated.

It’s also important to have the Content Body element on this page in your theme to make your lessons unique. Wherever you place the Content Body element is where you will be able to edit the unique lesson content. You can find this element in the Dynamic Slots elements section.

To keep track of members’ progress, include a button whose Button Action is Mark Complete. Depending on how you want to set up your lessons, you can place this directly onto the theme’s Lesson Page or place it in each lesson’s unique Content Body element.

Congratulations! You now know what Course elements are required for Themes and Lessons!