🔔 Feature Update as of September 2024: Widgets can now be used with the updated customer portal. Additionally, left and top navigation menus have been removed from the widget display.
📝 Overview
Website widgets allow you to embed interactive features directly onto your company website. Whether you want customers to browse programs, check availability, or view location schedules, widgets make that experience seamless without requiring them to navigate away from your site.
🔑 Authorizations
To access the Website Widgets page, your role must have the Company Account Settings authorization assigned to it.
🛠️ Setup
To access Website Widgets, type "widget" in the Global Search Box or navigate to Admin > Embed Widgets from the main navigation menu.
🌐 Developing Your Website
Click the arrow to learn about using widgets while developing your website
Click the arrow to learn about using widgets while developing your website
If you are still building your company website, you can test your widgets during development. The system needs to recognize every domain that attempts to display a widget, which is typically your company's web address. However, some third-party website development tools use additional or altered domains while a site is under development.
For example:
Wix uses an additional gateway domain called "fileusr.com"
WordPress uses an IP-based version of your domain, which you can find in your browser's address bar while editing your site
Both of these domains must be added to your Framing Websites list in Company Settings before your widgets will display correctly.
💡 For instructions on adding domains, visit the Framing Websites article.
🧩 Types of Widgets
There are three embeddable widgets you can add to your company website.
🗂️ Program Finder
The Program Finder widget allows customers to browse and search your available programs directly from your website.
Click the arrow to learn how to configure & embed the Program Finder widget
Click the arrow to learn how to configure & embed the Program Finder widget
The Program Finder widget includes the following customization options:
Width & Height: Adjust the dimensions to fit your website layout. Values must end in either "px" or "%" with no spaces (for example, 800px or 100%)
Sport: Limit results to a specific sport type
Location: Display all locations or a specific one
Program: Display all programs or a specific one
Once you have configured your settings, copy the generated embed code and paste it into your website.
📅 Online Booking
The Online Booking widget displays real-time availability based on your configured Booking Options, allowing customers to browse open slots without logging in. If a customer wants to complete a booking, they will be prompted to log in at that point.
Click the arrow to learn how to configure & embed the Online Booking widget
Click the arrow to learn how to configure & embed the Online Booking widget
Once the widget is configured, copy the generated embed code and paste it into your website.
⚠️ Important Note: The Online Booking widget requires the Online Booking Add-On feature to be enabled on your account. To learn how to turn this on, visit the Integrations & Add-Ons article.
🗓️ Location Schedules
The Location Schedules widget works similarly to the Program Finder widget and displays your schedule of events for a given location. You can control which search filters are visible to customers and set default values for Location, Event Type, and date range.
Click the arrow to learn how to configure & embed the Location Schedules widget
Click the arrow to learn how to configure & embed the Location Schedules widget
Use the toggle controls to show or hide specific search filters, then select your preferred defaults for Location, Event Type, and date range. Once configured, copy the generated embed code and paste it into your website.