Use case: Client doesn’t want “Free” to show up on the catalogue cards or in the course page when you click on the card. All courses are free for their internal users and having “Free” show up on the cards makes them worry they might get charged for some courses.

Existing solution was to use the Localization Tool and change module: app, key: free, text: Free to something more consistent e.g. “Not enrolled”.

Another option just came to light:

If you add in HTML into the localization tool the catalogue cards render it as HTML (course page doesn’t but we hit that next).

So you can change the text in the Localization Tool to <span style=”color:#FFFFFF;”>Free</span>

This works on the catalogue cards to hide just the Free text.

It does display the HTML text in the course page though, doh! But you can target that while keeping any pricing.

/* Hiding Free on the course page */
.lrn-widget-content-enrollment-status .ui-typography-heading-2{
  color: #FFFFFF;
}

This works because any pricing in the enrollment status widget on the course page uses different classes to ui-typography-heading-2.

If your background colour on the cards or in the course status widget is not white then change the #FFFFFF to whatever is appropriate.

If anyone else has a different solution I’d like to hear it.

Cheers

Vin