If you are setting up an ecommerce business, small or large, you will likely have to work with Shopify to get your online store up and running. When you use Shopify, you’ll have to navigate around Shopify variants to properly display your products. But, before we get ahead of ourselves, let’s first understand what a “variant” even is and how it works.
A variant, in Shopify’s world, is a variation of a base product. While useful for merchants just starting out, there are three very big cons with Shopify’s native setup should you need to scale your online store. Let’s take a look!
By the way, we reccomend Bl!nk as a solution to this >
Let’s get started by breaking down the first major con associated with Shopify variants. Think of an easy example to showcase the shortcomings of Shopify variants — t-shirts. The same style t-shirt can come in many sizes: small, medium, large, extra large, and so on. That is a perfect application of variants. In this case, “size” is our option set.
What happens if the same t-shirt style can also come in many colors? Red, blue, green, and so on. Now we have our second option set — color. Shopify allows a maximum of 3 option sets and a maximum of 100 total variant combinations. This might seem generous, but that 100 variant limit is more quickly realized than you might expect. Thus, we’ve identified our first con — why create variants for a product set that you know may be limited as you scale? The limited number of variants creates a landscape for future complications and hacky workarounds.
What happens if a specific variant is out of stock and you’d like to remove it from the frontend to avoid confusing customers? This is not natively possible in Shopify. You can control visibility only at the parent product level, not the variant level. Your only option is to either have a developer create hacky logic to conditionally hide variants from the frontend or accept that you’ll be showing out of stock variants. You could always delete the variant from Shopify, but that will create disjointed reporting should you ever bring it back in the future.
Now, let’s look at SEO and visibility impact of variants. Here is a link to a typical Shopify product that utilizes many variants. Notice every time you change a combination of option sets, in this case “size” & “color,” the ?variant=X changes. You can link directly to a variant combination of your choosing by adding this parameter to the end of the product URL. Not so bad, right?
Dead wrong. It’s very limiting, and our last con to be discovered also happens to be the biggest. Anything after the question mark in any url is not indexed by Google. And just like that, we lost the opportunity to have a unique URL per every option on our store and all of the SEO benefits that go along with it. Let’s take a look at a few examples of how Shopify variants can affect your URL, and the advantages of having unique URLs for each product variant.
The latter URL is product specific, making it stronger for your sitemap and SEO.
Even if the products share the exact same content, Google rewards this structure over the ?variant=X route.
Let’s look at Day Owl, a local Pittsburgh brand that has transitioned from a variant reliant setup to a more agnostic approach when they launched their headless site using blink. And, to really tie it all together, we’ll look at the platform decisions made around blink to support a multi-product approach vs a multi-variant approach.
Day Owl’s products only come with option set primarily, color — so the 100 variant limit wasn’t a true concern, they were more interested in the unlocked SEO benefits.
For example, take a look at this URL. Great. Now click one of the color swatches and notice how the URL changes.
What you are seeing is blink at its finest. The entire page just reloaded, but a normal user can’t even tell. But now for the fun part — try running each of those URLs through Facebook’s Sharing Debugger.You’ll notice both Unique Title Tags & Descriptions + Unique OG Images per each page.
Each and every single color has a unique product listing in Shopify. blink allows for the dynamic grouping of “like products” to recreate the single page variant experience while unlocking all of the advantages of a multi-product configuration. Stay tuned for more on this in a future product post!
Another consideration to pay attention to — many of Day Owl’s products are seasonal and once they sell out, they may not get the color back in stock for several months — or ever! The added benefit of hiding sold out products from the frontend is a nice perk that is easy to self manage. This way, potential customers are always seeing the latest and available for sale products at any given time.
Since pivoting from a single product/multi-variant to a multi-product architecture, Day Owl has fine-tuned their SEO strategy and achieved a greater level of control of their frontend. What is your brand doing?
Now there are still some extremely powerful use cases where variants come in handy. A blended approach like All Birds implores where each color is a unique Shopify product listing, but they keep their sizes as variants. This is a solid strategy. We’ll be talking more about this in a future post!
Keep an eye out for even more posts about optimizing your site architecture and how blink by Responsival is changing the way we interact about Shopify and ecommerce platforms.