Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

The grid module organizes site content into a cohesive layout, enabling appearance and user interaction customization. Options include shape, size, title, sort, and filter. You can also create multiple tabs with distinct filters and sorting for effective content categorization.

Creating a grid module | Module configuration | Design options | Setting up tabs | Configuring tab settings | Courses-tab filter and sort options | Groups tab filter and sort options | Library tab sort options | Sessions tab filter and sort options

...

  1. Select the + to the right of the Page Title and select Grid.

  2. Select the new Grid item in the content menu below to start configuring your new grid module.

...

  1. Name: Give the Grid a unique Name so that you can identify it later. The name doesn’t appear on the site page.

  2. Fill out the fields listed below to customize your Grid.

  3. Select Save Module to save your changes when finished.

Saving your changes

Tip

Remember to save your page updates when you are done editing any module to avoid losing progress by selecting the Save Page button.

...

Tailor the module's appearance and user interaction through these fields:

...

Show Title

...

Check box: Default - On

When the check box is unselected:

The Title is not shown on the front end to users

...

Title

...

Add a title that will show above the module.

...

Show Filter Options

...

Check box: Default - Off

When selected:

Gives the front-end user the ability to filter the content

...

Show Sort Options

...

Check box: Default - Off

When selected:

Gives the front-end user the ability to sort the content

...

Variant

...

Select the module shape from the drop-down menu. For example, it can be Circular, rounded, or square. Note that “square” can also be a rectangle; it just means it has hard corners instead of rounded corners.

...

Text align

...

Align the titles of each slide (not the module title). We recommend using Left for most content but Center for speakers (because they are circular).

...

Item width and height

...

Input 355 (width) x 200 (height) for a standard 16:9 ratio image. This corresponds to the image size (800 x 450) that we request from clients for most rectangular images

...

Item spacing

...

10 is the standard recommended spacing.

...

Item title

...

Check this box to see the title of the content beneath the slide.

...

Item description

...

Check this box to show the content’s preview text beneath the slide.

...

Show Progress

...

For courses only, check this box to show the progress indicator in the corner of the slide.

...

  1. To begin, locate the Tabs - Data Filtering section.

  2. Use the + icon to add new tabs.

    • The content you pull and organize will be shown within a grid.

    • If you create multiple tabs with different filters, the Page will display each as individual tabs above the Grid for easy access.

    • You can reorder tabs by dragging and dropping them.

    • The tabs are aligned from left to right on the page, with the top tab being the first, leftmost tab.

    • If only one tab is created, it will represent the entire page, and you will see no tabs.

...

Once you've created a tab, select it to adjust its settings.

  • Tab Label: This is the name visible to users if multiple tabs are created.

  • Content-Type: You can choose between Course, Group, and Session. Your selection impacts the filtering and sorting options available.

The Tab Settings window determines how the page/tab is pre-filtered and sorted, controlling how information appears when a user lands on the tab. Users can filter or sort the information further, but it will revert to the settings configured here upon leaving and returning. The grid module organizes site content into a cohesive layout, enabling appearance and user interaction customization. Options include shape, size, title, sort, and filter. You can also create multiple tabs with distinct filters and sorting for effective content categorization.

Creating a grid module | Module configuration | Design options | Setting up tabs | Configuring tab settings | Courses-tab filter and sort options | Groups tab filter and sort options | Library tab sort options | Sessions tab filter and sort options

...

Creating a grid module
Anchor
Creating-a-grid-module
Creating-a-grid-module

  1. Select the + to the right of the Page Title and select Grid.

  2. Select the new Grid item in the content menu below to start configuring your new grid module.

Module configuration
Anchor
Module-configuration
Module-configuration

  1. Name: Give the Grid a unique Name so that you can identify it later. The name doesn’t appear on the site page.

  2. Fill out the fields listed below to customize your Grid.

  3. Select Save Module to save your changes when finished.

Saving your changes

Tip

Remember to save your page updates when you are done editing any module to avoid losing progress by selecting the Save Page button.

2024-07-15_11-09-14.pngImage Added

Design options
Anchor
Design-options
Design-options

Tailor the module's appearance and user interaction through these fields:

Show Title

Check box: Default - On

When the check box is unselected:

The Title is not shown on the front end to users

Title

Add a title that will show above the module.

Show Filter Options

Check box: Default - Off

When selected:

Gives the front-end user the ability to filter the content

Show Sort Options

Check box: Default - Off

When selected:

Gives the front-end user the ability to sort the content

Variant

Select the module shape from the drop-down menu. For example, it can be Circular, rounded, or square. Note that “square” can also be a rectangle; it just means it has hard corners instead of rounded corners.

Text align

Align the titles of each slide (not the module title). We recommend using Left for most content but Center for speakers (because they are circular).

Item width and height

Input 355 (width) x 200 (height) for a standard 16:9 ratio image. This corresponds to the image size (800 x 450) that we request from clients for most rectangular images

Item spacing

10 is the standard recommended spacing.

Item title

Check this box to see the title of the content beneath the slide.

Item description

Check this box to show the content’s preview text beneath the slide.

Show Progress

For courses only, check this box to show the progress indicator in the corner of the slide.

Setting up tabs
Anchor
Setting-up-tabs
Setting-up-tabs

  1. To begin, locate the Tabs - Data Filtering section.

  2. Use the + icon to add new tabs.

    • The content you pull and organize will be shown within a grid.

    • If you create multiple tabs, the Page will display each as individual tabs above the Grid for easy access.

    • You can reorder tabs by dragging and dropping them.

    • The tabs are aligned from left to right on the page, with the top tab being the first, leftmost tab.

If only one tab is created, it will represent the entire page, and you will see no tabs.

Configuring tab settings
Anchor
Configuring-tab-settings
Configuring-tab-settings

...

Once you've created a tab, select it to adjust its settings.

  • Tab Label: This is the name visible to users if multiple tabs are created.

  • Content-Type: options available include Speaker, Course, Group, Library and Session. Your selection impacts the filtering and sorting options available.

The Tab Settings window determines how the page/tab is pre-filtered and sorted, controlling how information appears when a user lands on the tab. Users can filter or sort the information further, but it will revert to the settings configured here upon leaving and returning.

Any table section highlighted in yellow indicates that the content grid options for that section are either unavailable or not functioning.
Check back later for updates.

Speakers tab filter and sort options

Expand
titleSpeaker filter content options

Filter Content

Options

Options

Examples

Tags

Default Off

When selected, additional options appear for:

Required Tag(s): The content pulled Must have ALL of these tags

Optional Tag(s): The content pulled Can have ANY of these tags

Exclude Tag(s): Content with these tags will NOT be included

Dates

Default Off

When selected, a + icon becomes available so you can add multiple date types and time ranges to function on the tab simultaneously.

Date Type: Choose the date type you want from the list of options—an explanation of each in the next cell.

Time Range: Choose the time range you want from the list of options—an explanation of each in the next cell.

Date Types:

These options are pulled from the date sections within the speaker info page

Release Date:

End Date:

Time Ranges:

Specific: This option gives you a drop-down labeled Range and a Date field.

Previous: Choosing this option gives you an additional field labeled Days

Relative: This option gives you a drop-down labeled Value with time frame options.

Upcoming: Choosing this option gives you an additional drop-down labeled Days.

When setting dates in the Grid Tab:

  • Date Type Selection: Choosing a Date Type filters speakers based on that specific date.

  • Relative Timeframe: If selecting Relative and a timeframe, only speakers matching the selected Date Type will appear if their date falls within the specified timeframe. For example, choosing Release Date and Next Week shows speakers Releasing anytime the following week.

  • Before Date: When selecting Before and adding a Date, only speakers with a date before the specified one will appear. For instance, picking End Date and May 27, 2023, displays speakers ending before that date.

  • After Date: If you choose After and add a date, only speakers with a date after the specified one will appear. For example, selecting End Date and May 27, 2023, displays speakers ending after that date.

  • Date Range: Choosing Between and setting a date range only shows speakers with dates falling within that range. For instance, selecting End Date and From May 27, 2023, To June 27, 2023 displays speakers ending between those dates.

  • Combining Restrictions: Each set of date restrictions acts as an AND statement, narrowing down the results. For example, filtering for speakers releasing After May 31 and After June 31 only shows speakers meeting both criteria.

Expand
titleCourse sort content options

Sort Content

Options

Example

Sort By:

Alphabetical: grids are sorted by speaker title alphabetically, with numbers appearing before letters

Newest: The grids are sorted by speaker release date, with the latest releases appearing first

Start Date: The girds are sorted by the nearest start date, with speakers starting in the past appearing last and the most recent start date appearing first

Only Alphabetical sorting options are available for the Speaker content at this time.

Sort Order:

Default: Ascending

Ascending: Changes depending on sort by options. See next cell.

Descending: Changes depending on sort by options. See next cell.

Only alphabetical options work for sort options.

Alphabetical:

All speakers, regardless of their dates, should be returned in an alphabetically organized fashion (NOTE: speakers that start with a number should appear before speakers that don’t in the Ascending fashion and vice version in the Descending fashion)

  • Ascending: A - Z

  • Descending: Z - A

Newest:

All speakers whose Release Date both IS NOT null and is before today AND whose End Date is after today

  • Ascending: oldest to newest

  • Descending: newest to oldest

Courses tab filter and sort options
Anchor
Courses-tab-filter-and-sort-options
Courses-tab-filter-and-sort-options

...