RIO Ed - Short Course Listing
Introduced in v3.12 to support Continuing Education, this component is used on the Student Community, to display the short courses that are offered (Study Offerings).
For example, you can create a new page called 'Short Courses' on the Community Builder to place this component (navigate to Setup > Digital Experiences > All Sites).
This will act as a list of short courses (Study Offerings) displayed.
You can also place the RIO Ed - Short Course Filter component on top of the same page), for students to search / filter courses (as seen in the first diagram above).
See here for the other components and how they work in relation with one another.
Attribute Name |
API Name |
Description |
Object Name |
objectApiName |
Automatically bind the page's object name to the component variable. E.g. rio_ed__Study_Offering__c |
Object Filter Criteria |
predefinedFilters |
Enter criteria to define the default records to be shown on the short course wizard, e.g. rio_ed__Course_Offering_Status__c[=]Running;rio_ed__Default__c[=]true;hed__Section_ID__c[=]A, the SOQL query will fetch the records meeting the criteria. |
Object Filter Criteria Rule |
predinedCriteriaRule |
Enter criteria rule to define the default records to be shown on the short course wizard e.g. {0} AND ({1} OR {2}). |
Number of Records to Display |
noOfCourses |
Enter a value to show how many number of record card to be visible in a single view, i.e. on “show more” the same number will be added. |
Image Field Name |
imageApiName |
Api name of the image field to display. Add image of resolution 1500 x 300 pixels. |
Field 1 Name Field 2 Name Field 3 Name Field 4 Name |
field1ApiName field2ApiName field3ApiName field4ApiName |
To display record related details enter the API name of the field, e.g. StartDate__c or Description__c. |
Field 1 CSS Field 2 CSS Field 3 CSS Field 4 CSS |
field1Styling field2Styling field3Styling field4Styling |
To define the styling for this field go to Themes > Click on the dropdown > Click 'Edit CSS'. Add attributes, e.g. font-weight: 600;font-size: 14px;color: #984140;. Then, copy the name of the class and paste here, e.g. cardHeading2CSS. |
Sort By Date Field Name |
sortByDate |
Enter a DateTime API name, e.g. StartDate__c . This will help sorting the displayed records in ascending order. |
Sort By Text Field Name |
sortByText |
Enter a Text field API name, e.g. Name. This will help sorting the displayed records in alphabetical order. |
Sorting Picklist Label |
sortByValueLabel |
Enter the name which will be visible as label on the sorting combobox. E.g. Sort By. |
Show more button Label |
showMoreButtonLabel |
Enter the name which will be visible as label on the show more button. E.g. Show More. |
Filter Result Label |
filteredResultFoundHeading |
Enter the value which will be displayed as heading of filtered result. E.g. Result(s) found. |
Debug Mode |
enableDebugMode |
Enable debug mode. |