Submit a ticket My Tickets
Login  Sign up
Open navigation

How to Edit the Course Cards of your Courses

In LearnWorlds, all your courses can be viewed and purchased via compact and easy-to-understand Course Cards. The course cards are part of the Products section and they are an eye-catching point of attraction since they offer a brief sum-up (title, image, description, author, etc) of what your course has to offer.

Once you have added such a Products section e.g to your Home page, then when a potential user visits your school's Home page they can click on a course card to get directed to the course's layout page to view more or purchase the course. 

Before adding the Products section (Course Cards) to your school pages, it is recommended to set up the image, title, and description for all the courses in your school. 

Here is how you can set up your Course Cards:

1. Go to Courses and choose the course.

2. Navigate to the Settings course tab.

3. To add or change the image of your course card, click on Upload and choose your desired image. 

4. Add/change the Title of your course and the Description.

5. Add a Label, the Author’s Nameas well as the Author’s Avatar.

6. Don't forget to click on Save.

Everything you set up (course title, description, label, author name & picture) will be then reflected on the Products page section and its Course Cards.


  • The Title & Course Card image can also be added while initially creating your course.
  • The Author's name field will appear in your Courses section by the Author filter.
  • The Add a label field can be used in your custom Certificate template, as the Credits custom field.
  • The label field will also be displayed on the Course card as shown below:

  • If you would like to add space between the description lines, you can add <br> under each description sentence, and the space will be displayed in the Course Cards section.

  • You can make some alterations to your Course Cards section, by using the following CSS snippet for hiding the progress bar of the course cards.  To hide the progress bar (for enrolled users) on the course card the below CSS snippet should be added in the Custom code editor of your school, in the <style> Dynamic (css) field, and then click on Update.

/*hide progress bar from course cards*/
.lw-course-card .lw-interior-mt .learnworlds-overline-text {
display: none;

.lw-course-card-progress {
display: none;

Did you find it helpful? Yes No

Send feedback
Sorry we couldn't be helpful. Help us improve this article with your feedback.