This article will walk you through the process of configuring products in BookThatApp (BTA) that represent courses. You will specify a schedule for the class and the customer will be able to select a corresponding date and time.
In this tutorial, we'll take you through how to set up the Course Widget for your Shopify store.
There are 2 ways to create your products: via the Shopify admin product page, or through the app installation process. We recommend using the app installation method as it streamlines the process and walks you through each of the steps from product creation to implementing your booking widget.
If you opt to create your product in Shopify first please select the following link.
BookThatApp (BTA) Setup Wizard
The BTA setup wizard walks you through creating a product and configuring the widget that will allow the booking form to display on the product page of your storefront.
1. In the app admin select Installation to begin the process.
2. After selecting the option for the type of bookings you will take you will select the Next button to continue the process. For this example we selected the Courses option.
3. Here are a few brief notes regarding variants.
- Any option representing pricing should be done through variants.
- Do not enter the dates or times of the event as variants because you will create a schedule in the app.
- If you have a minimum party size requirement for your bookings you will want to create a set of variants for Party Size. An example of this would be a booking requirement for the minimum party size of 2 and a maximum party size of 7.
4. If you created your product in Shopify and imported it into the app choose Course as the Profile. This is automatically done if you are creating your product through the app's Setup Wizard.
The remaining configuration steps are the same regardless of the method you used to create your products.
5. Enter the Capacity of the course (max number of people permitted per time slot)
6. Choose to base capacity on Product, Variant, or Resource. In most instances, it will be product based. However, if you offer different types of bookings for the course you may choose to use variant based capacity.
7. Enter the Duration for the course sessions.
8. Add a Location (if applicable)
9. Add a cutoff date or future date (if applicable). This will let you schedule by location and include the location's address in reminder emails.
10. If desired, choose a set of colors for the class. This allows you to differentiate classes by color on the Booking Overview Calendar.
11. In the field under Sign Up List enter in email address where you want an enrollment report to be sent.
12. Create the Terms for your course. A Term is comprised of the course sessions. Please see the following for details on using the scheduler.
13. Select Save.
The Course widget can be used to allow your customers to choose a course term they would like to attend. The widget preview updates in real time so you can see the effect of the changes.
If you are using the Setup Wizard it will automatically walk you through the steps to configure and customize the widget. If you imported your product from Shopify you will need to complete the following steps.
1. Access the widgets section of the app by selecting Widgets.
2. Select the Course widget to enable it.
3. In the Products tab of the widget choose to add all your products that use the Course profile, or specify specific products.
4. Widget Settings
- Name: You can have multiple Course widgets with different settings so you can use the name field to describe what this widget is for.
- Mode: Determines how the widget appears in the product page. Inline or Popup option.
- Max Number of Terms: Set the max amount of terms that will display on the product page.
- Max Number of Events: Set the max amount of events that will display when viewing a term.
- Max Number of Months: Set the max amount of months into the future the widget will display terms.
- Show Timezone Helper: Includes a timezone selector at the bottom of the widget.
- Use Swatches: Display variants using swatches instead of a drop-down selector.
If you've completed the steps above you should now be able to visit the product page in your storefront and see the widget appear.