Full-Width Single Course Cards

Introduction

This page covers the use of what are referred to as Full-width single course cards.

We have used the following topic as an example, as it works differently from the My Courses page, where a list of courses is being brought in:
Different types of material

Note: Because it appears in a topic, rather than on a page (like the My Courses page) the styling has had to take account of/override Learndash coding, and the same would apply if you used it in a lesson.

IMPORTANT: The only way to make all the course cards the same size is to use a 5-column row as a starting point regardless of how many single course cards you want to show in the row. Then just put the shortcode into the relevant number of columns. If you set up a 2-column row because you only want to display 2 courses, they will not have the same dimensions and gaps between the course cards (see the example page – link above – we have shown how they will vary, but also included an example of Mini-courses using the original 4-column row AND a version using 5 columns so that you can see the difference ) – we can talk you through it, if it’s not clear!!

1. You must give the relevant course a category, so that the shortcode picks up only the ONE course, eg:

2. Insert a shortcode into the relevant column, using the category you have just set up

The shortcode to use is as follows, but enter the category for the specific course you want to bring in, as shown in green below:
ld_course_list progress_bar=”true” enrollment_status=”enrolled” course_category_name=”The Stress Curve”]

Note: You will need to add the square brackets at beginning and end of the shortcode

Note: This will NOT come in automatically with the correct styling.

3. In order to get the card to display full width within the column, add the following Class in the Advanced tab for EACH column you add a shortcode to:

full-width-course-cards