Use Posts for course catalog or summer camp

One great use of Posts is displaying a course catalog, summer camp offerings, or any other catalog-type display. With Posts, you can easily display each course or session flexibly, to allow users to browse for what they’re interested in. You can also display these in more than one place, while only having to update the information in one location.

Setting up posts

Each course or other catalog entry is represented by a post, giving you plenty of options for how you organize those posts. Consider how boards, categories, tags, and collections will play into your page design, and how you’ll use each of those to display your posts in Composer.

You’ll need at least one board to house your posts. You may want to only use a single board for your entire catalog, and rely on tags and categories to determine where the posts from that board are displayed. Or, you can use boards as your first level of categorization. Choose sections that do not overlap, such as “departments” or “semester,” and create a board for each one.

Now that you have your main organization decided on, think about your secondary categorization tools: categories and tags. These are similar, except that categories apply to only one board, while tags work across all boards. Also, users can filter content in a Post element by either category or tag, but Post elements can only be configured by tag. For example, if you want to display all foreign language courses together but let users filter by language, categories will work great. If you want to display all 11th grade courses, regardless of department, in a Post element, you’ll be better off with tags.

Finally, if the above options are not sufficient, you can consider creating collections for your catalog. Collections let you group together posts from any board and put them in any order you choose. You can make as many collections as you want, and display them in Post elements. Once in a collection, the number and sort order of the included posts will remain static.

For example, let’s look at a summer camp. Each camp session has a type that doesn’t overlap, so we’ll create boards for each camp type. Different camps are available to each grade-level student, so we’ll add tags for each grade.

Displaying in Composer

At the same time you’re deciding how to organize your boards and posts, think about how you want users to interact with your catalog. How will they be able to filter? What categories will you give them to browse by? Do you need separate pages, accordions, or tabs?

If you use multiple boards and want to display the courses on each of them separately, use a Board element to create a directory and then make a template that each board will dynamically populate.

1. Add a Board element from the Module tab of the element menu and set it to List or Grid format.

2. Select the folder where your course boards reside, and choose whether to open the board on a new page, or in an element on the same page.

3. In whichever location you select, add a Post element, and select all the boards from the folder to display.

With this setup, clicking on a board will provide users with a list of posts specific to that board, in whatever format you choose for the Post element.

You’ll probably want to make liberal use of the Post element’s content filter option “That also belong to Specific Tags.” If you’ve used descriptive tags while setting up your posts, you can use those tags to display posts from all of the boards you select. You can even combine this with the above board directory setup, to control which of the posts from the selected boards are displayed.

For example, let’s go back to our example of a summer camp with boards for each camp type and tags for each grade.

On one side of the page, we have a Board List element that lists all the boards in the Summer Camps folder, each camp type. On the right, we have two Post List elements, each in an accordion panel: one for grades 1-4 and one for grades 5-9. When you click on a board and expand a panel, you’ll see only those camp sessions matching both the camp type and the selected grade range.

To accomplish this, we’ll set up the right side first.

1. Add an Accordion element to the page.

2. Add a second panel, and name the first one “Grades 1-4” and the second “Grades 5-9.”

3. In the first panel of the accordion, add a Post element in List format.

4. Under Content Filters, set it to “Display posts from Boards” and select all the boards from the Summer Camp folder, then “That also belong to Specific Tags” and select the “1st,” “2nd,” “3rd,” and “4th” tags.

5. Make sure the rest of the settings are how you’d like them, and save the element.

6. Then copy the element, paste it into the second accordion panel, and change the selected tags to “5th,” “6th,” “7th,” “8th,” and “9th.”

On the left side, add a Board element in List format. In the settings, choose to display all boards from the Summer Camps folder, and under “Link To,” pick Element. Then, select both of the Post elements on your page from the dropdown list.

Utilizing Post Tools

In addition to the Post and Board elements, you can also use the Post Tools element to help users navigate your catalog. The Post Tools Search format can be configured to allow users to search courses in a Post element by keyword. The Category Filter and Tag Filter formats display the categories and tags, respectively, that are present in a Post element and allow users to filter by them.

The drawback to a Post Tools element is that it can only be linked to one Post element at a time, so it would not work with the example above. Keep this in mind when designing your page setup.