PayWhirl widgets & embed codes

PayWhirl's embeddable payment widgets allow you to display payment plan(s) to customers, provide a secure in-page checkout and much more.

Ryan P. avatar
Written by Ryan P.
Updated over a week ago

What is a widget?

A widget is just an application, or a component of an interface, that enables a user to perform a function or access a service.

In PayWhirl, widgets are how you display the payment options to the customer. They can be easily integrated into almost any existing website. All you do is copy a small snippet of code that we provide and paste it into your website builder. This is how you give customers the option to purchase the payment plans that you have created in your PayWhirl account. No need to redirect customers off your site!

All of our widgets automatically adjust to fill the space you give them. They even automatically format for customers viewing your site with a mobile device. 

Example: Widget on Page

Example: Widget added to an existing product page

Here is an example of a widget that is embedded on an existing product page.

Note: Only one widget can be embedded on a single page.

Buy Button Widget

If you don't want to change your existing page layout by adding an embedded widget IN the page, you can use the "buy button" version of any widget, so customers make their selections in a popup, OVER the page. 

If your website's product page text/description is positioned just under the platform "Add To Cart" buttons, you can use a widget BUY BUTTON embed code so it blends right in with your theme:

Example: Buy Button Widget

Example of a "Buy Button" popup (Pricing Table Widget):

How to forward to another widget (Custom Checkout)

A widget can even be used in a chain to create a custom checkout flow, allowing your customers to add additional items to their cart and build a custom subscription. 

Build-A-Box

One popular example is to create a "build-a-box" funnel, where you have customers select a "base plan" in an initial pricing table widget (one of our widget types) then forward customers to an upsell widget (another widget type we offer) to add additional items to the cart and build a custom subscription.

There are several different types of widgets; each has its own specific advantages depending on what you are trying to setup.

PAYWHIRL WIDGET TYPES

  • Pricing Table

  • Payment Form

  • Multi-Select

  • Upsell

  • Gift Code

  • Customer Login

For example, a pricing table widget allows customers to choose between plans, but not more than one plan at a time. This is ideal for membership situations where customers choose a specific tier as their plan (Bronze, Silver, or Gold level membership). It doesn't really make sense for a customer to select more than one in this situation. 

On the other hand, if you were selling a weekly meal subscription (chicken, fish, and beef) you may want to use the multi-select widget so customers could select more than one plan at a time.

A simple pricing table, a column-based layout where customers can only choose ONE payment plan at a time. However, customers are able to purchase multiples of the ONE plan if you enable quantity selectors in the widget settings. For example, in this pricing table example widget below; you can see that customers can select only one plan, but they can purchase more than one if they would like.

2) Payment Form

A single-column layout that only displays ONE payment plan or one-time option. You can adjust the "How do you want to charge the customer?" drop-down menu to select an existing payment plan or specify a fixed one-time purchase price.

Payment forms can also have a FLEXIBLE payment amount where they allow the customer to input the amount they would like to pay. 

In the example below, we have the payment form below tied directly to a subscription plan that charges $10/month. This means that anyone using this payment form to checkout will be subscribed to the "Monthly Coffee" plan when they checkout.

PAYMENT FORM SETTINGS & FRONT-END PREVIEW...

3) Multi-Select Widget

At first glance, the multi-select widget looks just like the pricing table widget, however, it enables customers to add MULTIPLE items to their cart before they checkout. For example, the customer can select multiple plans and/or multiples of each plan, then checkout.

FRONT-END PREVIEW...


4) Upsell Widgets

Upsell widgets are designed to work with pricing table widgets in a chain and allow you to offer custom "build a box" subscription packages. Your customers will start off viewing a pricing table widget and then are forwarded to an additional upsell widget(s) before they checkout. 

This allows customers to go through a "funnel" you create and add upsell item(s) to their carts to build a completely customized subscription. 

Similarly to payment forms, you set up the pricing information for upsells products or services in your widget settings directly. Upsells can be one-time or recurring charges.

FRONT-END PREVIEW...

NOTE: ANY RECURRING UPSELL LINE ITEM(S) IN THE CART WITH A PLAN WILL BE COMBINED WITH THE SUBSCRIPTION, AND WILL RESULT IN A SINGLE INVOICE EACH BILLING PERIOD.

If an upsell is configured to be RECURRING (via your widget settings), the upsell will be added to the same invoice with the "main subscription" selected in the first step of checkout (in the pricing table widget). 

For example, if you have a pricing table widget with two options (weekly or monthly) that is chained to an upsell widget, the upsells will inherit the same billing frequency as the "main plan" selected in ANOTHER widget, either before (recommended) or after the upsell widget.

NOTE: You can allow customers to edit upsells on upcoming/unpaid invoices from the customer portal via the advanced settings menu in your account.

This widget allows your customers to purchase a gift code for someone else. Gift Codes on PayWhirl are like a cross between promo codes and traditional gift cards. They work like digital gift cards with a pre-paid balance and are delivered by email to the recipient.

If a customer purchases a gift code for someone else, they won't have to create an account for the recipient and/or manage their payment information on an ongoing basis. 

The recipient will receive an email (on a specified date by the customer purchasing the gift code) with a unique link to redeem the code and create their OWN account if they don't already have one. 

FRONT-END PREVIEW...

The login widget is a simple login form you can embed on your website to allow PayWhirl customers to log in and manage their own account information. Once an existing customer logs into your portal via the login widget, they will be able to access all their subscription information, past payments, credit card, shipping info, etc.

Related Articles:

Please let us know if you have any questions. 

Sincerely,
The PayWhirl Team

Did this answer your question?