Overview

We are excited to release the new OneFitStop Embed Widgets for brands to integrate into websites for access to client portals. These new Embedded Widgets are script based and no longer iFrames so as to give them more of a look and feel as part of your own web solution. We have remodeled the widgets to look and work much the same as our Branded App experience. This should provide congruency in your member and client experiences there by reducing friction and increasing overall user satisfaction.

 

As we roll out components of the new V2 Widgets, we will be revising the modules presented in the first version iFrames such as Class Listing and Bookings, Package purchases, Client sign up and Log In, Booking Privates and Gift Card sales. While we are not reengineering the aggregate Dashboard view, we will be offering new embedded solutions that allow pre-filtering to individual instructor’s class listings as well as filtering by session types so that you can place these specific lists in the dedicated pages of your website and online portals.

The first release is a Beta Release including the following widgets:

  • Classes
  • Packages
  • Private
  • Standalone package widgets
  • Gift cards
  • Workshops
  • Login / sign up widget
  • Client dashboard

In the coming weeks, the following functionality will also be added to these widgets:

  • Dynamic Theming and Site Configurations, Custom CSS
  • Forgot password
  • Spot Reservations
  • Content Suite

 

Instructions for use

Configuration

To reveal your new Embedded Widgets, simply navigate from the Business Dashboard to Edit Profile> Website Embed. Under Option 2 – Website Embed you will find a new toggle along the right side labelled Try Beta Widget Code.

mceclip0.png

Slide the toggle to the ON or right position to reveal the new Embed Script codes.

 

Now you will see the new Embed options to include Classes, Packages and Privates

mceclip1.png

Please share with your web development resources these new code scripts so they may place them in your website.

Classes

The classes option comes with some filter options for Sessions and Instructors. As to be expected, if All Sessions and All Instructors are left in the filter then all sessions will be displayed on your website using the default widget code.

When you select one of the Session types from the drop down you will then see the widget code alters to include only those Session types in the web display.  This could be a way for you to call attentions to specific program offerings on a portion your site.

mceclip2.png

Similarly, if you preselect an instructor, then the available widget code can be copied into a dedicated page about your instructor, displaying his or her own classes:

mceclip3.png

Your Classes will present in your website with your own configured colors as well for congruency to your branding.  Here is a sneak peak at the Classes listing:

mceclip4.png

The bookings process is as expected with Clicking the booking button and seeing the details page,

mceclip5.png

Selecting a spot if configured,

mceclip6.png

Package selection or purchasing as required for the access to the class

mceclip7.png

And a system acknowledgement of booking completion

mceclip8.png

Packages

The Packages widget code also includes by default all packages and an option to alter the view as Page or Model view.

mceclip9.png

If for instance you wish to select a specific package for advertisement in a special area of your site, then the model view may be an option to promote immediate purchase of that offering

mceclip10.png

Here is a sneak peek at the Package listings Page in your web browser:

mceclip11.png

Package purchases have all the necessary steps you would expect such as details page,

mceclip12.png

Agreement review with Signature capturing,

mceclip13.png

Payment type capture with processing.

mceclip14.png

Stand Alone Packages. 

Use Case:

“As a business user, I want to share a direct link on my website to a specific package or membership, so that my clients and members may purchase directly without having to select from a list. "

V2 Package Widget feature where by you may link directly to a page or modal view a Stand Alone package. 

Navigate to Edit Profile> Website Embed> toggle ON the Try Beta Widget Code> select Packages and then choose either the Page or Model view before copying the code to your website builder. 

mceclip0.png

 

Privates

Privates as well have a standard code offering for accessing and booking from all of your instructors available for Private session types. It also includes a filter for optional single instructor schedule displays.

 

mceclip15.png


Here is a sneak peek at the Privates listing page in your web browser and the work flow to book.

mceclip16.png

mceclip17.png

mceclip18.png

mceclip19.png

mceclip20.png

 

New Client Sign Up

Included in the web widgets are Sign Up and Login workflows. Here as well is a peek at the workflows.

mceclip21.png

mceclip22.png

 

Gift Cards

Gift Card web widgets configuration code can be found here among the other Beta Widgets: 

Dashboard> Edit Profile> Website Embed> Try Beta Widget Code-

mceclip0.png

Add this code to your website and the following screens will be available:

Until your clients are logged in they will be met with the following, 

mceclip1.png

 

Upon client login, then your configured Gift Cards will appear for selection and sale:

mceclip2.png

Clients are expected to select their gift card and enter the recipient email and name, when configured, and their own information for receipt and card delivery. 

Guest Checkout for Gift Cards is not yet released. 

 

 

Workshops

The Workshop web widgets configuration code can be found here among the other Beta Widgets: 

Dashboard> Edit Profile> Website Embed> Try Beta Widget Code-

mceclip0.png

Add this code to your website and the following screens will be available:

mceclip1.png

Like Classes, your client simply need to click on the Book button and follow the prompts to complete their booking or buy a package in the process should they not have the appropriate credits already available on their account. 

mceclip3.png

mceclip2.png

 

mceclip4.png

 

Stand Alone Login or Sign Up Widget

When you use the Stand Alone Login Widget found here...

mceclip0.png

 

...You may display a login UI tool anywhere on your webpage. as your clients log in to this tool, then they will be logged into all widgets on your website. 

Use the widget code displayed above to place the following tool on your website:

mceclip1.png

When your client clicks on the this graphic, they will be presented with the following Login or Sign up widget:

mceclip2.png

 

Client Dashboard

Use Case:

“As a business user, I want my clients and members to be able to log in and manage portions of their profile and perform actions relevant to our business."

We have released the updated V2 Dashboard Widget feature that you may embed directly in your webpage. this Client dashboard will allow your clients and member, after logging in, to perform the following actions. 

  • See Failed payments alerts,
  • Retry Failed payments,
  • Edit Profile,
  • Review My Packages,
  • Redeem Gift Cards,
  • Review Visit History,
  • Review Billing Information,
  • Change their password, and
  • Review My Bookings. 

Directions for use:

in the Business Dashboard, please navigate to Edit Profile> Business Profile> Website Embed section. 

Locate the Try Beta Widget Code toggle and position it to ON. 

In the bottom right of this section, click to highlight Dashboard and the embed code will be revealed.  Add this code to your website where you wish your clients and members to be able to Log In and manage their account.

Your embedded Dashboard code will reveal itself in the following manner directing your clients to log in. 

mceclip0.png

 

Upon a successful Login, your clients will see the My Bookings and Stats as the landing page. Any payment alerts they may have will be displayed here until resolved. 

mceclip1.pngYour clients may click on the View failed payments button for more details.

Clients may Retry Payments right from this screen by clicking the Retry payment button. 

blobid1.png

 

Clicking on one of the My Bookings items will provide a more detailed view of the session and an opportunity for the client to cancel should you have it configured. 

blobid2.png

 

Clients may navigate through the remaining buttons on the left to reveal the following actions:

 

Edit Profilemceclip3.png

My Packages

mceclip4.png

Redeem Gift Card:

mceclip5.png

view Visit history:

mceclip6.png

mceclip7.png

mceclip8.png mceclip9.png

Change their Password:

mceclip10.png

 

 

Have more questions? Submit a request

Comments