Overview

We are excited to release the new Hapana 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.

This Release includes the following widgets:

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

See as well the following:

Dynamic Theming and Site Configurations, Custom CSS

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.

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, Privates, Workshops, Gift Cards, Dashboard and Standalone Login:

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 attention to specific program offerings on a portion of your site.

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

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:

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

Selecting a spot if configured,

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

And a system acknowledgement of booking completion

Packages

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

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 the immediate purchase of that offering:

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

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

Agreement review with Signature capturing,

Payment type capture with processing.

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.

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.

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

New Client Sign Up

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

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-

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

Your configured Gift Cards will appear for selection and sale:

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 is available for Gift Cards.

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-

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

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.

Stand Alone Login or Sign Up Widget

When you use the Stand Alone Login Widget found here among the other Beta Widgets:

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:

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

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.

Add this code to your website where you wish your clients and members to be able to Log In and manage their account.

You may select yes or no to Directly Display the edit profile dialog when the user logs in to the dashboard. If "yes" is selected, this could be a way for you to force the user to update their profile when accessing the dashboard. If "no" is selected, the user will land on the dashboard home page after login.

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

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.

Your 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.

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.