Program Details List component

Display dates and information about a program or course.

This guide demonstrates how to create a Program Details List component.

Step by step

To add the Program Details List component:

  1. On the page you are creating or editing, select the Component tab. Then, tap the Components drop-down


     
  2. Choose Add Program Details List.
     
  3. The component will appear. Complete the following fields:
    1. Title - Enter a section title, which will display in large font.
    2. Default state of the mobile accordion - The Program Details List will display as an accordion on a mobile device. Select Closed if you would like the default state to be closed or select Open if you would like the default state to be expanded.
    3. Term - Enter the term the course or program will take place. This will appear as bolded text.
    4. Date - Enter the date the course or program will take place. If it is a date range, enter the date range.
    5. Body - Enter more information about the program or course.
       
  4. Additional actions you can take include:
    1. To add another row, select Add Program Details List Item.
    2. To move or rearrange the order of items, drag and drop a section to the position you'd like using the 6 dots, found to the left of the item.
    3. To remove a single item, tap the three dots within the item section, then select Remove.
    4. To delete the entire component, tap Remove. Then, tap Confirm removal
       
  5. Select Save. If you are ready to publish your page, ensure the Published toggle is enabled (green in color). 

Example

Front-end

Title

Term 1
MM-DD-YYYY

This is an example of the "Body" text in Program Details List Item #1.

Term 2
MM-DD-YYYY

This is an example of the "Body" text in Program Details List Item #2.

Term 3
MM-DD-YYYY

This is an example of the "Body" text in Program Details List Item #3.