Stripe

Overview

Now it’s easier than ever to get up and running to sell usernames through Stripe! Simply connect your Stripe account to your VT System and with a few clicks you will get a small code snippet that you can place on any web page to take payment and create usernames and passwords in real time to provide instant access for your customers.

Once you follow the steps below to connect your Stripe account and then create a product, LightSpeed VT will generate a small snippet of code that you can place on any page or site that you want and it will insert the following Payment, and Username/Password creation. This is really valuable as just having the payment process through Stripe, and create the username some other way is not nearly as valuable as allowing the user to create their username and password right here and immediately sign them in.

It will also detect if Apple Pay or Google Pay are available on their mobile device and those easy payment options are available for them to use too.

This process will also check if their username already exists and all of the other necessary checks to correctly create their user account that are not otherwise possible without building a customization through the API.

Once the payment is successfully processed, there is a confirmation message briefly displayed, and then the user is automatically signed in to the VT System with the Username/Password they just created.

Note: When embedding the Stripe widget, you should avoid using a fixed height to display it, as the widget will change heights with error messages, as well as when adding Google pay, Apple Pay, etc.


Connecting Stripe to LightSpeed VT

To connect Stripe, we need to obtain these four “items” noted below, and in the next few steps, we’ll show you how to do it.

  • Item 1: Stripe Publishable Key Token (from STRIPE)
  • Item 2: Stripe Secret key Token (from STRIPE)
  • Item 3: Stripe Web hook Endpoint (from your VT System)
  • Item 4: Stripe Webhooks “Signing Secret” Token (from STRIPE)

Step 1 :

  • Sign into your Stripe dashboard 
  • Click “Developers” in the left menu bar
  • Choose and click “API Keys” in the resulting expanded left menu bar
  • Click “Reveal key token”
  • If prompted, enter the password for your Stripe user account
  • Publishable key and Secret key will be available (Items 1 & 2).
    Copy and save the information for both keys and proceed to Step 2 below.
Step 1

Step 2 :

  • In a separate or a new browser tab, sign into your VT System
  • Go to the “Super User Dashboard”
  • Look for section ID “105” and click “Integration Management”, this will take you to your “Integration Management” dashboard
  • In the main menu bar, click on the “Stripe Integration” tab, then on the “Stripe Account” sub-tab
  • On the resulting screen, click “ADD NEW ACCOUNT”
  • Refer back to your earlier saved key tokens (Items 1 & 2) and copy and paste the token values in their appropriate matching fields
  • Click “SAVE AND CONTINUE”
  • On resulting screen, copy the generated “Stripe Webhook Endpoint” url (Item 3) and proceed to Step 3 below
Step 2

Step 3 :

  • Go back to your Stripe account dashboard
  • Click “Developers” in the left menu bar
  • Choose and click “Webhooks” in the resulting expanded left menu bar
  • Click on “+ Add endpoint” button located on the top right of the main area
  • In the newly opened modal window, paste the “Stripe Webhook Endpoint” you copied in Step 2, into the “Endpoint URL field
  • Using the pulldown menu for “Events to send”, search for the following 2 events and select them:
    • customer.subscription.deleted
    • Invoice.payment_succeeded
  • Click the “Add endpoint” button to save your input and selections
  • On resulting screen showing a list of endpoints, click on the Endpoint URL you just added
  • In the “Signing secret” section, click “Click to reveal”. Enter your Stripe account password if prompted
  • Copy the token (Item 4) and proceed to Step 4 below
Step 3

Step 4 :

  • Go back to your VT Integration Manager to finish your account setup
  • Paste the token (Item 4) you copied at the end of Step 3 into the “Stripe Webhook Signing Secret Token” field
  • Click “Save”
  • Congratulations, you’re done adding your Stripe account information. You can now add products!
Step 4

Create eCommerce products with Stripe and LightSpeed VT

At this time, with this Stripe integration feature you can create one time purchases or subscriptions. 

If you have not connected Stripe to your VT System, CLICK HERE to link to the article on how to do that first.

The steps below are for basic setup. For more options, please review our “Advanced Settings” section.

Step A -1 or B – 1 :

  • Sign into your VT System
  • Go to the “Super User Dashboard”
  • Look for section ID “105” and click “Integration Management”, this will take you to your “Integration Management” dashboard
  • In the main menu bar, click on the “Stripe Integration” tab, then on the “Stripe Account” sub-tab
  • You will be redirected to the “Individual Purchase Settings” tab
  • Slide to “Enabled” to activate the option to take payments for individual subscriptions
  • Choose “Location” for the “Apply to:” option
  • Pick the system holding the location you wish to use
  • Select the location in which your users will be created
  • Click “SAVE AND CONTINUE” 
Step A – 1 or B – 1

One time purchase (Option A)

Step A – 2 :

  • Sign into your Stripe dashboard 
  • Click “Products” in the left menu bar (Note: If you do not see “Products” in the left menu bar, use the Search bar at the top to search for “Checkout Settings” – then on that screen, click to enable “Checkout client-only integration” – this will add the “Products” menu item to the navigation bar.)
  • Click the “+ NEW” button located on the top right of the main area
  • Choose the “One-time purchase products” option if not already selected
  • Enter the name for your product
  • Enter the amount you will charge for your product
  • Click “Done”
  • Look for the “SKUs” section in the middle of the resulting page
  • Click on the “…” option in the far right side of the product listing you just created
  • Choose and click “Copy SKU ID to clipboard”
  • Proceed to “Step 3-A” below
Step A – 2

Step A – 3 :

  • Go back to your VT Integration Manager/Stripe Integration section
  • Click on “Individual Purchase Settings” tab and choose the “Products” sub-tab
  • Click the “ADD NEW PRODUCT” button
  • In the “Name” field, add a name for your product
  • For “Product Type”, choose the “One time payment” option
  • Paste the SKU you copied in Step 2-A, into the “Stripe PlanId/SkuId” field
  • If you want to restrict your product to limited coupon codes, check the “Restrict Coupon” checkbox and choose the coupons that will apply (See Advanced section for more details)
  • Under “Set User To Access Level”, choose the Access Level that will be assigned to newly created users
  • Add content role IDs to the “Add role(s)” field
  • Under the “Code Snippet” section, copy the generated code that will be used to insert in your checkout page
  • Click the “ADD” button at bottom
  • Your product is now configured and you are ready to use your code snippet
Step A – 2

Recurring Subscription (Option B)

Step B – 2 :

  • Sign into your Stripe dashboard 
  • Click “Products” in the left menu bar
  • Click the “+ NEW” button located on the top right of the main area
  • Choose the “Recurring products” option 
  • Enter the name for your product and click the “Done” button
  • On the next screen, create a  “Plan nickname”
  • Set the “Price per unit”
  • Click the “Add pricing plan” button
  • On resulting screen’s main content area, look for the “Pricing plans” section where your new plan is displayed
  • Click on the plan to access its details
  • In the “Details” section, copy the plan ID
  • Proceed to “Step B – 3” below

Step B – 3 :

  • Go back to your VT Integration Manager/Stripe Integration section
  • Click on “Individual Purchase Settings” tab and choose the “Products” sub-tab
  • Click the “ADD NEW PRODUCT” button
  • In the “Name” field, add a name for your product
  • For “Product Type”, choose the “Subscription” option
  • Paste the Plan ID you copied in “Step B – 2”, into the “Stripe PlanId/SkuId” field
  • If you want to restrict your product to limited coupon codes, check the “Restrict Coupon” checkbox and choose the coupons that will apply (See Advanced section for more details)
  • Under “Set User To Access Level”, choose the Access Level that will be assigned to newly created users
  • Add content role IDs to the “Add role(s)” field
  • Under the “Code Snippet” section, copy the generated code that will be used to insert in your checkout page
  • Click the “ADD” button at bottom
  • Your product is now configured and you are ready to use your code snippet

CHECKOUT FORM OPTIONS

Passing user info to widget

You can also pass user information via the url in order to prefill the Stripe Widget. The parameters that you’re able to prefill are First Name, Last Name, Email and Coupon.

The parameters that you can pass in the url are:

  • fname
  • lname
  • email
  • coupon

Here’s an example of what the url would look like if you passed in first name, last name and email
https://your-site.com/stripe_widget.html?fname=obiwan&lname=kenobi&email=obi.wan@lightspeedvt.com

Custom CSS

You’re able to modify some of the form layout and colors, by using custom CSS on your webpage. We’re providing a “starting” custom CSS file to help you get started with the targeting of CSS elements. See below for details.

<<LINK TO CSS>>

Elements names

  1. #sf_fname
  2. #sf_lname
  3. #sf_email
  4. #sf_login
  5. #sf_password
  6. (Optional) #sf_coupon
  7. This area uses Stripe CSS
  8. #sf_btnSubmit

Coupon field

The coupon field can be hidden by using the parameter “use_cpn” with a value of “0”.

<script src="https://xxxxxxx.lightspeedvt.net/xxxxxx/st_snippet.aspx?dataid=1&p=9231885d-124d-413c-98ea-814901bbyuy81&use_cpn=0"></script>

ADVANCED PRODUCT SETTINGS

Adding additional pricing options

For each one of your products, you can create multiple pricing plans with different prices and time periods. The configurations are done in your Stripe.com. Follow the Integration Management steps above (Step A – 3 or Step B – 3) for each additional SKU or PLAN you created.

One Time Product

In details view for the product, click “+ Add SKU” for each pricing option you wish to create. 
Name and specify amount for each option. For example: Bronze for $97.00, Silver for $197.00, Gold for $297.00.

Subscription

In details view for the product, click “+ Add pricing plan” for each pricing plan you wish to create. 

  • Name and specify the amount to be charged for each option. For example: Monthly for $97.00, Yearly for $1,297.00.
  • Choose the correct “Billing interval”
  • If using a trial period, set the number of days

Notes: “Metered usage” , ”Multiple price tiers” and “per group” options are currently not supported under individual purchases.


Coupons

If you create a coupon in your Stripe.com account, all coupons can be applied to all products by default. If you wish to allow a coupon code to only be used with certain products, you will need to restrict the products in your LSVT integration panel.

Step 1 :

  • Sign in to your Stripe.com account
  • Click “Billing” in the left side menu
  • Click on “Coupons” in the resulting expanded sub menu
  • In the main content area, click the “+ New” button
  • On the resulting screen, in the “Name” field, type a name for your coupon
  • Choose the “Type” of discount to be applied and the corresponding amount or percentage
  • Choose a duration and corresponding frequency
  • If desired, select “Redemption limits” and corresponding settings
  • Click the “Create coupon” button in the bottom right
  • Proceed to “Step 2” below

Step 2 :

The coupon code you created in the Stripe.com admin is now available in your LSVT integration management area. Pick the products for which you want to restrict the use of coupons and select the coupons that will be allowed to be used.

Example:
You have 3 products (A, B and C). You created 2 coupons. One for 50% off and one for 20% off. If you do not restrict the coupon codes, both coupons can be used with products A, B and C.
If you restrict product A to only be able to use 50% coupon, products B and C are still able to use both coupons.


Product expiry options

One time products

When using a “one time payment” product, you can specify an action to be taken X number of days after the purchases. The following options are available:

  1. Default (Nothing configured): User’s account remains active
  2. X Day(s) or Month(s) after purchase
    a) Deactivate user’s account: User’s account will be deactivated after specified time period from day of purchase

    b) Do not deactivate user’s account: Same as default, but allows for extra actions to be taken after specified time period
    • Restore user’s original content roles settings: Content roles that were added and/or removed upon creation of account will revert to original settings after time
    • Add Role(s) / Remove Role(s): Will add or remove content roles after specified time period from purchase day

Subscriptions

When using a “subscription” product, you can specify an action to be taken when the Stripe.com subscription expires. The following options are available:

  1. Default (Nothing configured): User’s account remains active
  2. Deactivate user’s account: User’s account will be deactivated upon expiration of subscription
  3. Do not deactivate user’s account: Same as default, but allows for extra actions to be taken upon expiration of the subscription

    a. Restore user’s original content roles settings: Content roles that were added and/or removed upon creation of account will revert to original settings after expiration

    b. Add Role(s) / Remove Role(s): Will add or remove content roles after expiration

Upgrading/Downgrading

Our checkout form has the ability to recognize if a product is a new product to be added or if it is a product that can be upgraded/downgraded from an existing product a user already purchased.

For upgrades/downgrades, create a new plan or SKU under an existing Stripe.com product and create a new code snippet form in your integration management control panel. Send your existing users to the new forms. Once they make a purchase, the user will be assigned the new settings. If the product is a subscription, the old subscription will be cancelled and the new subscription will take effect.


Misc Options

Teams

If you have configured teams in your LSVT main admin area, you’re able to assign users to a selected team upon creation of user’s account after purchase. Simply select a team from the “Assign user to team” field option

Team selection
Team selection options

Send an email notification to

Send an email to the list of email addresses specified each time a purchase is made for this product.

Email notification

Disclaimer

You can specify disclaimer or any other text to be displayed below the submit button. This field will allow the input of basic HTML for formatting purpose.

Disclaimer admin settings
Disclaimer front end output

Success Message

This area allows you to create an informative message to be displayed after a successful transaction. This field will allow the input of basic HTML for formatting purpose.

Success message admin settings
Success message front-end output

ADVANCED ACCOUNT SETTINGS

Several configuration sections are available under “Individual Purchase Settings”. Please review additional information for each section below:

“Apply to:” Location vs. System

Choosing “Location” will generate a checkout form code snippet that will create users in the specified location.

Location vs. System options – Location

Choosing “System” will generate a checkout form code snippet that can be used to create users in any location within the specified system. In order to use this option, you must add the parameter “loc” to the generated code snippet’s URL before inserting in your page.

Location vs. System options – System

Generated snippet:

<script src="https://xxxxxxx.lightspeedvt.net/xxxxxx/st_snippet.aspx?dataid=1&p=9231885d-124d-413c-98ea-814901bbyuy81"></script>

Modified snippet:

<script src="https://xxxxxxx.lightspeedvt.net/xxxxxx/st_snippet.aspx?dataid=1&p=9231885d-124d-413c-98ea-814901bbyuy81&loc=12345"></script>

Send notification email upon user’s creation

If a user is created during the purchase process, we’ll send out a notification email to the user with its credentials. It will inherit the same settings as the email template from the main LSVT system.


Allow user to update profile

If the option is unchecked, the user will not be able to update their LSVT user profile.


For all products add the following roles by default

A list of default content roles to be added to the user’s account can be specified in this field. When a purchase is made, the default roles will be added first, then any other role actions specific to the product will be taken. This allows to set ‘non purchased’ content roles for example.


Tips & Notes

When adding a product to your Stripe.com account, specifying an image is unnecessary since our code does not use this feature.