Guide to product variants

Read this guide for an overview of product variants, adding prices to variants, variant layouts and quantity.

This guide is designed as an overview and introduction to adding product variants.

Unlock extra functionality for your one-page checkout by adding product variations (like colors and sizes), creating pricing tiers, variant layouts and offering different quantities.

Product variations like colors and sizes

One of the most popular variant use cases is adding product variations like colors and sizes.

Product variations allow your customers to choose the most suitable product for their needs and preferences.

You can also add a photo for your variant option and a short description to share more information about your product options.

Display as accordion

If you offer multiple variant options, it is easy to collapse them as an accordion to save space.

There is no limit to the number of variants you can add to your checkout.

You can drag and drop your variants to arrange the order of them in your checkout.

Add prices to variants

By adding prices to variant options, your business can cater to a wider range of customer needs and budgets.

You can also implement more effective pricing strategies or differentiate your product tiers, like Standard and Premium.

Increase or reduce variant pricing

You can choose to increase or reduce the price for every variant.

Simply enter the variant price with either “+” or “-” before the number.

Discounted from pricing

You can also add a Discounted from price to discount each variant option individually.

Show “+” in variant pricing

If your variant options are at an additional cost, you can choose to show the “+” sign in your variant price. Tick Plus sign before price in the Layout settings.

In the Layout settings, you can also choose to show/hide other variant information, like Variant name, Option names, and Option prices.

Quantity per option

You can add a quantity selector to your variant through variant Settings. Choose Quantity per option to allow your customers to purchase multiple product types at the same time.

Remove base pricing

If you wish to only use variant prices in your checkout, you can set the base price of your checkout to 0 in the Details tab.

One-time purchases for subscription product variants

When selling subscriptions, product variant options can now be an additional one-time purchase.

This is great for offering one-time items and order bumps to a subscription plan.

You can choose the one-time Billing model when adding prices to variants for a subscription checkout.

Manage stock and SKU

You can add stock levels to each variant option. Tick Manage stock in your variant Settings.

When the stock level reaches 0 or is set to 0, the option will be Sold out.

You can also add an SKU – stock-keeping unit.

SKU numbers should be unique to each variant option and allow you to keep track of each item in inventory.

Tick Set SKU in your variant settings.

Variant layout

List

By default, your product variants will be displayed as a list.

Grid

You can display your product variants as a grid by clicking on Layout and selecting Grid.

You can choose the number of columns that best suits your design.

Text alignment

By default, your variant text is aligned to the left.

You can center-align the text within your variant in the Layout section.

Examples

Here are some ideas for product variants.

Donation form

This form has been set up in the following way:

• Checkout base price as $0
• 3 variant options with different pricing tiers
• Variant marked as Required
• Displayed as a Grid (3 columns)
• Showing Variant name and Option prices
• Text aligned to Center

Event tickets

This variant has been set up in the following way:

• Checkout base price as $0
• 2 variant options with different pricing tiers
• Added a Quantity selector
• Variant marked as Required
• Displayed as a Grid (2 columns)
• Showing Variant name, Option name and Option prices
• Text aligned to Default

Products with quantity selector per variant option

This form has been set up in the following way:

• Show / hide logic enabled: 5 product variants with "is" conditional logic (show sizes for each color selected)
• Quantity per option enabled for T-shirt sizing
• Variant marked as Required
• Displayed as a List and ticked Display as accordion
• Showing Variant name, Option names, Option prices, and Plus sign before price