Online Programs: Customizing Your Program List

18 min read
The Program List showcases previews of all your programs where visitors click to view their full details. You can decide how you want to categorize programs, adjust displayed details, or personalize layout and design.
Tip:
In this article, learn more about:

Customizing the Program List by category

Organize the programs on your list by category. This makes it easy for site visitors to find what interests them, encouraging them to join new programs and grow your participant list.
Tip:
To customize the Program List by category, make sure you create categories from your site's dashboard.
Wix Editor
Editor X
Studio Editor
  1. Go to your editor.
  2. Click Pages & Menu  on the left side of the editor.
  3. Click Program Pages.
  4. Click your Program List page.
A screenshot showing how to access your Program List page in the Editor.
  1. Click the Program List element on your page.
  2. Click Settings.
  3. Customize the categories and the programs in them using the available tabs:

Customizing the Program List details

Choose which info displays in each card in your Program List. You can show or hide the Program List title and details about each program such as the cover image, duration, participants and price. 
Wix Editor
Editor X
Studio Editor
  1. Go to your editor.
  2. Click Pages & Menu  on the left side of the editor.
  3. Click Program Pages.
  4. Click your Program List page.
A screenshot showing how to access your Program List page in the Editor.
  1. Click the Program List element on your page.
  2. Click Settings.
  3. Click the Display tab.
  4. Choose which details you want to display:
    • List Details: Enable the toggle to show the title on the Program List. 
      Note: You can edit the default "Programs" title in the Text tab
    • Program Details: Click the checkbox next to each detail you want to show on the list:
      • Image: Show the program cover image. 
      • Duration: Show the duration of your program (e.g. 18 days).
      • Participants: Show the number of participants in the program.
      • Price: Show the price of each program. 

Customizing the Program List layout

The Program List arranges your programs in cards in the layout you prefer. You can display the programs in a grid or stack them vertically on the page. 
Wix Editor
Editor X
Studio Editor
  1. Go to your editor.
  2. Click Pages & Menu  on the left side of the editor.
  3. Click Program Pages.
  4. Click your Program List page.
A screenshot showing how to access your Program List page in the Editor.
  1. Click the Program List element on your page.
  2. Click Settings.
  3. Click the Layout tab.
  4. Choose a layout and set it up: 

Customizing the Program List design

Design the look of the Program List including its background, dividers, text style, buttons, badges, and categories. 
Wix Editor
Editor X
Studio Editor
  1. Go to your editor.
  2. Click Pages & Menu  on the left side of the editor.
  3. Click Program Pages.
  4. Click your Program List page.
A screenshot showing how to access your Program List page in the Editor.
  1. Click the Program List element on your page.
  2. Click Settings.
  3. Click the Design tab.
  4. Choose what you want to customize:
Tip:
Click Reset to Original Design at the bottom of the panel to restore the default design settings. 

Customizing the Program List text

Go to the Text tab to edit the title of your Program list and the buttons and labels that appear in it. 
Wix Editor
Editor X
Studio Editor
  1. Go to your editor.
  2. Click Pages & Menu  on the left side of the editor.
  3. Click Program Pages.
  4. Click your Program List page.
A screenshot showing how to access your Program List page in the Editor.
  1. Click the Program List element on your page.
  2. Click Settings.
  3. Click the Text tab.
  4. Click the relevant fields to update the text:
    • List title: Edit the title that displays at the top of the list.
    • Button Text for Visitors: Edit the text that displays on the button that visitors click to join a program.
    • Button Text for Participants: Edit the text that displays on the button that participants can click to view details about the program they've joined. 
    • Participant: Edit the label text that displays for participants that have joined. 
    • Request Pending: Edit the label text that displays for participants that have a pending request to join a program. 
    • Program Completed: Edit the label text that displays for participants that have completed a program.

FAQs

We are here to help with all your questions. Click a question below to learn more.

Did this help?

|