In order to increase your profits, adding a wide range of options for your customers to choose from can greatly improve their experience. In this guide, I’ll show you how to add variants to your Shopify store.
If you’re looking for more customization options for your variant functionality, the final section will allow you to customize your product variants for a seamless and visually appealing storefront using a free Shopify app.
So be sure to take advantage of this valuable resource. Now, let’s get started!
Table of Contents
1. What Is Shopify Product Variant?
In order to manage their products effectively on Shopify, merchants are given the ability to create additional variants for their products. Variants are product selections that have different colors, sizes, or features based on the original product model, and they only appear on products with multiple options.
Shopify allows merchants to add up to 100 variants per product and up to three customized options. This is more than what other platforms typically offer. When creating a new variant for a product, merchants can adjust the price, inventory, and shipping options to fit each variant.
2. Limitations of Shopify Product Variants Settings?
Different products may offer varying options for buyers to choose from. For instance, one product may allow buyers to select from different sizes, colors, and materials, while another product may only offer options for weight, color, and style.
If you need to exceed the limits of options and variants, we suggest referring to the recommended applications listed in the later section. Customizing the theme code is also an option if you prefer to do it manually. However, this may require a good understanding of coding, which most store owners may not possess.
It is important to be aware that if your store has over 50,000 variants, there is a limit to the number of variants that can be uploaded daily using any application, including third-party ones, or CSV file imports. This limit permits the submission of only 1,000 new variants per day. Hence, to bypass this limit, a Shopify Plus subscription is necessary.
3. How to Add Shopify Product Variants?
Step 1: Select a product in your Shopify Admin
To add variants to a product in your Shopify account, start by logging in and going to the Products section. Select the product you want to modify. For example, in the image below, we’ve chosen the Fuzzy Navel Sweater.
Step 2: In the Variant section, click Add variant
To add a new variant, navigate to the Variants section located below and click the “Add options like size or color” button.
Step 3: Enter the Option name
By default, the name of the option is set to Size. But the good news is that you can adjust it so it could suit your needs.
Step 4: Enter Option values
When creating an Option in your system, you can name it “Size” and then add different values such as “S”, “M”, “L” or “XL” into the Option values field.
Step 5: Add another variant option
To add additional options, click on “Add another option”. If your variants differ in multiple ways, you can add them using the same steps as before.
Step 6: Manage variant options
In this particular step, there is a checkbox located on the left-hand side of each variant.
By clicking on the checkbox, you can select multiple items at once and make bulk edits. Additionally, you have the option to modify the values of the Price, SKU, and Barcode for each variant.
Step 7: Save variants
To save your completed process, simply click on the Save button.
If you’re using an iPhone or Android device, the first step in adding another variant to your existing product is to establish a new option for your product. Once you’ve created all the available options, you can then proceed to add product variants.
4. Top 3 Recommended Shopify Product Variants Apps
With just a few clicks, you can edit and add variations with the default settings. But don’t limit yourself to just the basics! For a truly personalized and dynamic shopping experience, check out these top 5 variant options apps.
1. Vario – Variation Swatches
With Vario – Variation Swatches by SeedGrow, you can empower your customers to make their ideal product choice effortlessly. Simply by clicking on color swatches, image swatches, or buttons, your customers can choose the perfect variant.
Vario’s interface is user-friendly, with a preview panel that allows for clear adjustments.
Plus, the exclusive features include readily picked color codes and the ability to hover over swatches to view their larger image thumbnails. So take your customer experience to the next level with Vario – Variation Swatches by SeedGrow.
Key Features:
- Support for 80+ official Shopify themes and custom themes.
- Ability to design swatches with built-in options such as style, border, tooltip, and more.
- Hover functionality on swatches to display variant titles, image thumbnails, zoom effects, and more.
- Display impressive color and image swatches on product and collection pages.
- Efficiently streamline the number of swatches on collection pages to fit the column grid.
- Cost-saving fee
Pricing:
Free plan available. 14-day free trial.
2. EXPO ‑ Extra Product Options
With EXPO, you can create over 100 extra options for your customers to personalize their purchases. From custom-made printables to engraved items, your customers will be able to create unique products that reflect their individuality.
And the best part? EXPO makes it easy to add these options to your product pages in bulk.
Plus, EXPO is compatible with many translation apps, so you can expand your reach and connect with customers from all over the world. And with automatic currency conversions, you can boost your global sales without any extra hassle.
Key Features:
- Unlimited options and custom fields allow customers to create unique products.
- Automatic expansion of next options based on customer selection.
- Ability to add extra fees and discounts based on selected products and conditions.
- Option to assign entire option set to specific hand-picked or group of products.
- Easy bulk addition of options to product pages, including dynamic variant options, infinite options, and add-on services.
- Reasonable fee
Pricing:
Free plan available.
3. Swatch King ‑ Variant Options
Improve your Shopify product variant options with Swatch King. Swatch King offers a variety of features such as a color swatch slider, variants with prices, variant image swatches, dropdown menus, hiding out-of-stock variants, and confirming size selections.
By using StarApps Variant System, you can link similar product variations without relying on Shopify Variants, allowing them to be SEO-friendly and easily synced with Facebook, Google Shopping Feed, and Amazon Sales Channel.
Additionally, you can add up to 100+ variations, and display variants separately on collection pages for more accurate search and filtering, and more.
Key Features:
- Include color swatches, buttons, variants with prices, dropdowns, and more.
- Boost SEO with Amazon-like Product Variations
- Showcase Color Swatches or Size Buttons: show off your products and make it easy for customers to navigate through your collection pages.
- Manage Inventory: hide out-of-stock items, confirm size selections, and receive low-stock alerts.
- Bulk Upload Swatches and Groups: upload your products in bulk using CSV and API, with support for Shopify Markets.
Pricing:
Free plan available. 30-day free trial.
This section provides a guide on how to set up and personalize Shopify product variant swatches through the use of Vario.
5. How to Customize Shopify Product Variants?
Step 1: Add Product Variants
To begin, proceed to the Shopify product editor, and follow the instructions outlined in part 3 of the blog to add product variants.
After successfully adding all variants for the Fuzzy Navel Sweater product, move on to the next step of customizing the appearance of the swatches to achieve a beautiful look and feel similar to the image provided above.
Note:
At Shopify, the possibilities are endless! Each product can have up to three customizable options and up to 100 variants.
It’s important to keep this in mind when creating your products so that they fit within Shopify’s variant image swatches.
But don’t worry, if you need even more options to help your products stand out, check out EXPO – Extra Product Options.
Step 2: Set Up Variant Option Styles
This step will help you to choose styles for your Shopify product variant options. After installing Vario, you will see the Plans tab. Please pick a plan and then you will reach this screen to approve the subscription.
1. To begin, navigate to Apps > Vario > Variant Option Settings from your Shopify admin to access a list of all variant options.
If you have made any adjustments to your product listings or collections, be sure to return to Shopify admin and click Refresh to immediately update the variations.
During this process, the screen will display “Updating products” and should only take a few seconds to complete. Once finished, the settings screen will show all successfully loaded variant options.
2. Once you have added all the product options, you have the flexibility to select a suitable style for each of them.
For instance, here I opt for a Button style for the Size option and select a Custom Image swatch style for the Color option.
Step 3: Customize Swatches
This step will enable you to design your own product variant swatch cell, shape, border, color, etc.
After selecting appropriate styles for the Shopify product options, you are now able to customize the variant swatch according to your preferences.
This can be done in the Variant Option Customizer card where you can design swatches that are set in Color/Custom Image Swatch or Button style from the previous step. Additionally, you have the ability to customize the Sold-out option and Collection page.
The design screen is user-friendly and allows you to see the effects of your changes in real time. Any modifications made on the left side of the screen will be reflected instantly on the right side.
Customize Swatches Style
Design the appearance of your swatches and preview the results before finalizing:
1. Customize the shape of your swatches by selecting either a circle or square shape.
2. Choose from small, medium, or large sizes for your swatches.
3. Select the border colors for both inactive and active swatches.
4. Enable or disable the variant name tooltip to have the variant swatch name displayed on the hover.
The Vario application provides four effect options, enabling you to select the most suitable one for displaying your products effectively.
In Early Verse, you are free to choose between 2 options:
- None: Nothing happens on hover
- Name: Show variant title as a tooltip on hover
In Universe/Metaverse, you will have 2 advanced options:
- Zoom: Slightly enlarge automated and custom image swatches on hover
- Image: Show variant image and swatch title as image tooltip on hover. This option is well-used with Custom Image Swatch because it will help hover the image illustrated for that variant, just like how this milk tea’s flavor variant shows in this image below.
Note: In this case, the sweater’s color variants are in Color Swatch style as I set up from step 2, so it still shows the color variant title like “yellow”, “cream”, “purple”, etc.
This time, the Automated variant image swatch will help you hover the image for each Color Swatch.
In Vario, go to Variant Option Settings > choose tab Color > choose Automated variant image swatch from the dropdown
Then justify the image size. And click Save.
Now you see the Color Swatch of Fuzzy Navel Sweater can hover the image over its different color option. We have saved more time because we don’t have to upload variant image files over again.
5. Choose the most unique part of your custom image swatch for positioning.
6. Always remember to preview your design and click on Save.
Customize Button Style
This card allows you to customize the swatches that are displayed in a button style, as previously selected:
- Button size: choose between small, medium, and large
- Button styling: set color profiles for buttons’ background, border, and text
Customize Sold-out Style
The Sold-Out card allows you to personalize the appearance of swatches when a variant is out of stock. You have two choices:
- Show out-of-stock variants: This option enables you to display out-of-stock variants upfront. You can choose between Cross, Gray Out, or No Effect
- Hide out-of-stock variants: This option enables you to hide out-of-stock variants initially, but they will be displayed when buyers select that variant. You can select from:
- Automatic: Automatically hide out-of-stock variant swatches when loading page. Use this when you have only one variant title per product (i.e. Color)
- Interactive: Hide out-of-stock variants once a swatch is selected. Use this when you have more than one variant title per product.
Customize Collection Page
This card provides a valuable solution for formatting your product page to display different variants of products, allowing buyers to easily choose their preferred option while browsing the page.
With this feature, you can choose the size of the swatches and pictures displayed on the product page.
There are checkboxes for selecting whether to:
- Show variant label
- Limit the number of swatches/button
- Add action when the customer press the variant swatch button like Do nothing, Link to product page, or Show the rest of the swatches.
Remember to click Save.
Step 4 (BONUS): Add Translation to Variants
For multi-language apps, it’s important to provide translations of your variant names into different languages so your customers in those countries can understand them.
To make your Shopify product variants look well in multiple languages, follow these steps:
1. In the Translation card, click on the variant options and select the language you want to translate by clicking the (+) button.
2. Type the variant name in the chosen language.
3. Click Save to save the translation.
6. Conclusion about Shopify Product Variant Customization
In conclusion, adding variants to your Shopify store is a simple yet effective way to enhance your customer’s shopping experience and increase your profits.
With the step-by-step guide we’ve provided, you can easily create new variants and customize them according to your business needs. And if you’re looking for even more customization options, Vario is a free Shopify app that can help you create a visually appealing storefront that your customers will love.
So why not try Vario today and see how it can help you increase customer satisfaction and boost your profits?
