Upselling with the Stripe Widget

Content

Version 2 of the Stripe widget is here! The updated version allows you to collect customer information such as name, email and phone number upfront before any payment info. This will allow you to collect more data and retarget any potential customers that abandon the checkout process. The new widget is broken up into three steps

Step 1 – Collect customer information
Step 2 – Collect and process payment information
Step 3 – Create username and password

In this article, we’ll go over how to use the Stripe widget to upsell within Clickfunnels. Even though we’ll be using Clickfunnels in this example, the concepts discussed here can be applied to any website building platform or CMS that you wish to use. The first step in this process is to connect your Stripe account to your LightSpeedVT system. If you haven’t done this already, head on over to https://support.lightspeedvt.com/knowledge-base/stripe and check out our Stripe article which goes over how to connect Stripe with LSVT step by step.

Once the connection is made, you’ll need to create your products in Stripe and then configure those products within LSVT. In this example, we’re going to be setting up three products, “Sales Mastery” which is a one-time charge, “Sales Mastery Live” which is a monthly subscription, and “Talk More, Sell More” which is a bonus course that we will setup as a bump product. The idea is to present the customer with the one time charge product first along with the bump product, then upsell them to the monthly subscription. After they’ve made the initial purchase for the one time product, they’ll be redirected to an upsell page which will contain the widget for the monthly subscription.

Creating the Stripe products

Log into Stripe, then navigate to the products section and click “Add product”

You’ll need to give the product a name, a “standard” pricing model and then set it to “One Time”.

For B2C products, the Pricing Model should always be set to “Standard Pricing”

Next we’ll create the “Sales Mastery Live” product, which will be a monthly subscription and then the “Talk More, Sell More” product which will also be a one time product.

Now that we have the products set up for the funnel, lets jump over to LightSpeed and configure each product.

Configuring products in LSVT

We’ll need to log into LightSpeedVT and head over to “Integration Management [105]” from the Super User Dashboard.

Next, we’ll choose the “Account” option in the Stripe section, that will bring us to the product section where we can see a list of all the products we’ve configured in LSVT so far.
Click “Add New Product”

When adding a product, you’ll need to provide several pieces of information. The table below shows the details.

Field	Value
Active	If checked, the product is active and can be purchased
*Name	Name of the product
Description	A description of the product
Bump Product	An additional offering added to the initial product
*Product Type	Subscription or one time payment
*Stripe PlanID/SkuID/PriceID	Older products may have a “PlanID” for a subscription product, a “SkuID” for a one products. Moving forward, any new products created will only produce a “PriceID”
Restrict Coupon	If checked, you will be able to choose which Stripe coupons can be used with this product
*Set User To Access Level	LSVT access level that users will be set to when purchasing this product
Assign user to team	If you teams enabled and set up, you can choose the team that users will be assigned to.
Add Role(s)	Content roles associated with this product. If you aren’t sure how to get the content role ids, click here to view our article on content containers
Remove Role(s)	Any content roles to be removed
Send and email notification to	LSVT will send a purchase notification to the email specified
Disclaimer	Disclaimer
Success Message	The message to be displayed after a successful purchase
Sign In into LSVT application after successful purchase	If checked, the user will be signed into LSVT and a cookie will be created in the background.
After completion redirect URL	If a URL is specified, the user will be redirected to that URL upon successful purchase. If a URL is NOT specified then, the user will automatically be redirected to the LSVT Main menu.
Product expiry options	What to do if the subscription expires or is cancelled.
Make product available for upgrades / downgrades	Allows users to upgrade and downgrade to and from this product

When setting up the bump product, you can add HTML to the description of the product and it will be shown on the widget. The images below show the HTML we added for the Talk More, Sell More bump product

After configuring the products in LSVT, we’re going to circle back to the Sales Mastery product and add the book as the bump product. Then we’ll add the redirect url that will take users to the upsell page after a successful purchase.

Note: In the example above, we’ve checked the box to sign users into LSVT after a successful purchase, then we added the redirect URL. This will sign users into LSVT in the background and create a cookie in the browser, then they’ll be redirected to the URL specified. This functionality allows you to place a “No Thank You” or “Get Started Now” button on the upsell page that will redirect users straight to the LSVT main menu and bypass the login page.

When all of the fields have been properly filled in, we’ll copy the code snippet and click “Update” to save the changes

By default, the code snippet generated will display the v2 Stripe widget, but if you wish to use the original Stripe widget, just click the “Show Legacy Code” and copy that code snippet instead .

The “Allowed url parameters” allow you change some functionality of the Stripe widget. For example, If you’d like to remove the coupon field from the widget, you can pass “&use_cpn=0” as a parameter at the very end of the opening script tag, it will end up looking like this.

<div id="LSVTStripeForm"><script src="https://webservices.lightspeedvt.net/stripe/st_snippet2.aspx?dataid=74&p=27cp1644d5-9676-45a4-a6z9-ff5c3e309263d&use_cpn=0"></script></div>

Adding the widgets to Clickfunnels

Now that we have the code snippet copied, we’ll jump over to the funnel we’ve created within Clickfunnels. In this example, we’ll place the widget for “Sales Mastery” on the first page.

When editing the page, go to the section where you want to place the widget and click “Add New Element”. The element that you’ll want to add is “Custom JS/HTML” .

Click on the new element, then click the “Open Code Editor” button and paste in the code snippet, make sure to click “Save” after you exit the code editor

Next, we’ll do the same thing with the Sales Mastery Live page.

Now we’re all set and ready to drive traffic to our funnel. When users purchase the Sales Mastery product, they’ll enter their name, email and phone number. On the second step they’ll have the option to add the bump product do their order and enter their CC info. When the payment is processed successfully, they can create their username and password.