Introduction

This article will explain how Reservations features can be used to create a Web page where parents or guardians can sign up their student for a new program. In this example, a school is starting a program for students who might otherwise be home alone after school. Two different clubs will be offered each day, and students who join the program will be able to choose which one they would like to attend.

Parents and guardians will be able to visit the page to view program information, and sign up online. To sign up, a parent or guardian will enter their contact information, then select their student's preferred clubs from a list. Each time a student joins the program, a seat will be reserved in their selected clubs, and a notification email will be sent to the program's organizer. Each sign-up will also be logged in The Digital Bell, providing an overview of the students who have joined, and which clubs they are set to attend.

Note, while this article is not a step-by-step tutorial, it provides a brief overview of how Reservations can be used for a specific purpose. Examples such as this, located at the top of the Reservations section, will help you become familiar with this new feature, and what it can be used for.

The first step in the process is creating the Schedule, which will contain the available club choices. The Schedule will then be integrated with the form, where the parent/guardian will enter their contact information, and select the student's preferred clubs. The form will then be added to a Web page, allowing parents and guardians to sign up their student online. Finally, and example of the requests sent in, from parents/guardians who have signed up their student, are shown.

Program Information

Each day after school, two clubs will be offered: an outdoor/athletic club and an indoor/classroom club. The students who join up will get to select their preferred club for each day of the school week, five clubs in total, which they will attend for the duration of the program. Program placement is limited to 50 students at this time, and club selection will be based on a "first come, first served" basis.  

The program organizer has come up with the following agenda: 

  • Monday 3:00pm - 5:00pm: Basketball (30 students max) or Photography (20 students max)

  • Tuesday 3:00pm - 5:00pm: Soccer (30 students max) or Spanish (20 students max)

  • Wednesday 3:00pm - 5:00pm: Tennis (20 students max) or Computer Lab (30 students max)

  • Thursday 3:00pm - 5:500pm: Kickball (30 students max) or Chess (20 students max)

  • Friday 3:00pm - 5:00pm: Flag Football (30 students max) or Art (20 students max)

Now that the agenda for the program is set, the information will be transferred into The Digital Bell's Reservations system.

The Schedule

Creating a Schedule is the first step in transferring the program information into The Digital Bell. The Schedule will include each of the available club choices, and the start and end date of the program.

When creating a Schedule, a title is entered, along with a description of the Schedule's intended purpose:

create schedule

Once the Schedule has been created, Time Slots and Time Slot Groups are added to it. In this example, each Time Slot will represent an after school club, while Time Slot Groups are used to organize them by day. Parents or guardians who view the finished page will be able to view each day's (or Time Slot Group's) choices, and select the clubs (or Time Slots) their student will attend.

Time Slot Groups are added first, so that the appropriate group can be selected when creating the individual Time Slots. When creating a Time Slot Group, a title will be entered, and a "weight" will be selected.

time slot group

The title of the Time Slot Group will also be used as a subheading on the finished sign-up page, and the Time Slots that have been added to the group will be listed underneath. This has the effect of creating a clean, clearly labeled sign-up form, making it easy for parent/guardians to read and fill out.

The "weight" determines the order in which the group will appear on the page, relative to other groups. The lower the weight, the higher up on the page the group, and its Time Slots, will be listed. For example, a Time Slot Group with a weight of "0" will appear above a group with a weight of "5." The "Monday Clubs" group would have the lowest weight, with each subsequent day-of-the-week group having an incrementally higher weight.

Next, the Time Slots are created. When adding a Time Slot to the Schedule, the appropriate Time Slot Group is selected from a drop-down menu. As there will be two club options for each day, the "Monday Clubs" Time Slot Group is selected when creating the "Basketball" and "Photography" Time Slots, and so on.

Each Time Slot created for the program will include

  • A day-of-the-week group
  • The club's title
  • The start/end dates and times for the program
  • The available seats
  • A short descripton of the club

The example images below show the form used to create the Photography club's Time Slot.

add new time slot

Using Reservations features to create the program's sign-up page is preferabe to using a standard form, as the "Available Seats" option is used to limit the number of times a Time Slot can be selected.

The program is limited to 50 total students, and each club has it's own enrollment limit, which is entered in the "Available Seats" field. The Schedule will keep track of each selection, and will not allow more students to join a club once the limit has been reached. As the enrollment limit for each set of clubs adds up to 50, this also has the effect of limiting total enrollment in the program.

Additional Time Slots are then created for each club. 

time slot list

After the remaining Time Slots have been added to the Schedule, the form can be created.

The Reservation Form

The reservation form will include fields for a parent/guardian to enter their contact information, and select their student's preferred clubs. When first creating a form, the title and "Thank You" message are entered, along with a description of the form's purpose. The "Thank You" message will be displayed to a parent or guardian, once they have completed and submitted the form.

creating the form

thank you message

After completing this preliminary section, the Form Editor will be available. Form Fields are added in the Form Editor, which prompt the parent/guardian for information.

The full tutorial for creating a reservation form includes detailed information on adding Form Fields, but for the purposes of this example, a quick overview will be provided for creating a Form Field that prompts a parent/guardian for their first name.

New Form Fields are added by clicking the "Add new field" link, located in the right margin of the Form Editor page.

add form field link

After clicking the link, the Form Field's "type" is chosen. In this case, it will be a "Text" Form Field, which allows a visitor to enter a short string of text, such as a name or address.

Next, the title of the Form Field is entered. The title is used internally, and will not appear on the completed page. Next, the "name," which is another internal field, is added. The "name" field is important, as this is one way the form communicates with the Schedule. The full tutorial includes specific information on what will need to be entered into this field. 

form first name

After completing this section, an expanded list of options is presented, specific to creating a "Text" Form Field. Here the "label," is added, which is the prompt a visitor will see on the completed page. For example, if "First Name" is entered into the "label" field, visitors will see "First Name" followed by a blank text box where they can enter their name.

The "Is Required" option is set to "Yes," which will not allow the form to be submitted without information in this Form Field. 

form field expanded options

The remaining options are left at their default settings, and the Form Field is submitted and added to the form. Additional Form Fields are then added, which request a last name, email address, student name, and emergency contact info.

form fields

Once all of the Form Fields have been created, the Form Actions are added. 

While Form Fields are used to collect data, Form Actions take that data and perform various tasks with it, such as processing online payments, or sending emails.  Two Form Actions are required for reservation forms: "Reservation Schedule" and "Notification Email."

The "Reservation Schedule" Form Action is used to integrate the form with a Schedule, and automatically adds your Time Slots. "Notification Email" sends a message containing the submitted form data (name, email etc.) to the email address of your choice, whenever a visitor completes the form. 

Form Actions are added by clicking the "Add new action" link, located in the right margin of the Form Editor page.

add form action

Next, the type of Form Action is selected from the drop-down menu. After clicking the "Submit" button, an expanded list of options appears. The specific options in the expanded list depend on the type of Form Action that was selected.

reservation schedule action

For example, after selecting the "Reservation Schedule" Form Action, a layout is chosen. In this case, the "Form" layout will work best. This layout allows a visitor to select multiple Time Slots when submitting the form - i.e. one club on each school day. Next, the "Schedule" drop-down is used to select which Schedule (and associated Time Slots) will be integrated with the form.

reservation form action

The "Notification Email" Form Action works much the same as the "Reservation Schedule" action. Here, a title is entered for the emails, as well as the address where the notification will be sent.

email notification

After adding the Form Actions, the form is complete. The next step will be adding the form to a Web page.

The Reservation Page

Once the form is complete, it can be added to a Web page. A new page is created for the program, and the content editor is used to add information for parents/guardians, as well as the form itself.

In the page's content editor, forms are added by clicking the "Forms" link, located in the right margin - under the "Add Content" heading. Clicking this link adds a new "Form Group" to the page, where an existing form is selected, and added to the page.

add form to page

After adding the form to the page, the finished product is previewed by clicking the "Vew on Website" button, located in the right margin. The images below show the finished reservation page for the after school program.

reservation page example

club choice example

Each time the form is completed and submitted, the parent/guardian will be shown the "Thank You" message, the e-mail notification will be sent to the program's organizers, and a Request will be logged in The Digital Bell.

Viewing Requests

One of the benefits of using Reservations is that the information entered into the reservation form can be viewed, and even printed, without having to do a manual export of the form data. This information can be viewed by first mousing over the "Calendar" link, in the menu at the top of the Digital Bell Dashboard, then clicking on "Reservations."

Reservations link

Next, the Schedule's central information page can be viewed by clicking the "View" button (magnifying glass icon).

view schedule

This page will provides access to any Requests, Time Slots, or Time Slot Groups that have been added to the Schedule. Requests appear first, by default, and list the chosen Time Slot, the Time Slot Group it belongs to (if any), and the name and email address of the individual who submitted the Request.

Examples of the Requests that would be sent from a parent/guardian submitting the after school program form are shown in the image below. Since multiple Time Slots (i.e. clubs) are being selected, multiple Requests are logged with each Submission.

There would be one Request for each day - five in total - with each submission. As seen in the example below, each Request lists the Time Slot Group (day of the week), Time Slot (the club), and the name and email address of the parent/guardian. In this example, a student has selected Soccer on Tuesday, and Tennis on Wednesday.

Requests

The data entered into the Form Fields can be viewed in full by clicking the "View" button (magnifying glass icon) to the left of any Request. This information can be used to contact the parent/guardian to confirm their student will be taking part in the program.

full request information

Now that you have learned how Reservations can be used to sign up students for an after school program, you can continue reading the introductory examples to learn more, or proceed to the Reservation Schedule tutorial - the first in the series of in-depth tutorials on creating and implementing Reservations.