Adding the Class Filter

Adding the Class Filter to your website.

1. First, navigate to Class Filter in the left hand vertical navigation.
   
2. Create a Filter. Once you are on this page you will click one of the options to start building a filter.
3. Give your filter a name. Not like “Baxter” or anything. Just something to help you remember it. I’m going to name my filter “Example”, because I’m SO creative like that.
4. After clicking “Save” you will be brought to a blank Filter Building Canvas.
5. You can rename your filter anytime by typing in the canvas name field at the top.
6. Start Building your Filter. You build a filter by adding “Filter Steps”. These steps are required information your users will click (or tap on mobile) in order to progress. By selecting these options they should get a custom list of classes defined by the options you specify. Here are the options available to you:
   1. Select Location
   2. Select Program
   3. Select Level
   4. Select Session
   5. Select Age

   

7. After you add a Filter Step to your Filter, you can customize it to only show the options you want.
   
   1. Step Label – Change the step label to something you prefer. Maybe a different language. Or, maybe something that better fits your school.
   2. Define what options to Show – You may want to only include some options or only exclude some options. You decide.
   3. Display Style – You may want to only display some options as buttons and some as default iClassPro Boxes.
8. Your Filter is Finished when you choose “Display Result”. After selecting this option you must click “Save” before trying to preview your filter.
9. Using different display types. Your filter will allow you to use different display types based on criteria you provide to it. Those display types are:
   1. Weekly Class Calendar
   2. Class Table
   3. Filter Plot
10. Display Type criteria. You can choose the default display type by using the select menu under Default Class Display.
    
11. Display Criteria – You can opt to use different displays if different options are selected when your users are utilizing your class filter. In order to do so, click “Add Display“.
    
12. Defining Custom Display Criteria. You can define a set of criteria or a single one. It’s up to you.
    1. Here is an example of using just one piece of criteria.
       1. Select the Display Type
       2. Select the Criteria
    2. Here is an example of using a set of criteria.
    3. To add another piece of criteria just click the “And” button
13. Preview your class filter. But first, make sure you click “Save”
14. Copy the Shortcode. On the preview screen copy the shortcode. Then add it into your website wherever you like.

Hot Diggity Dog, PHEWWW. You did it!!