Setting Product Option Defaults

Set product option defaults for your products

• Set default variant or option values for product
• Default to having no option selected for a product
• Limit a product to only show a specific variant within a source: product 

1. Ways to set product option defaults and limits
2. Rules precedence
3. Feature details & configuration instructions
   1. Set default product option values via Shopify metafields
   2. Set a product variant default via a URL Query String
   3. Limiting to a specific variant within the Source Product
   4. Set a default product variant in the source product settings

       

Ways to set product option defaults and limits

• Set your product to default to the most common size everywhere it shows on the site
• Set your product to default to having no variant selected in order to force customers to select their size

Rules Precedence

1. Limiting to a specific variant within the Source Product (see more info)
2. Set a product variant default via a URL Query String (see more info)
3. Set a default product variant in the source product settings (see more info)
4. Set default product option values via Shopify metafields (see more info)
5. If none of the above are set, and the first variant is out of stock, then the product defaults to the first variant that is in stock.
6. If none of the above are set and the first product is in stock, then the product defaults to the first variant listed in the Shopify product admin.

Setting Product Options Via Metafields

In order to set product defaults via metafields:

1. Add the following product metafields to your Shopify store with the namespace nyla_options and the keys defaultValue1, defaultValue2, defaultValue3. The values 1,2 and 3 correspond to the order of the product options in Shopify. Make sure that the metafields can be accessed through Storefront API. Shopify's official documentation for how to do this is accessible here.
   
   • nyla_options.defaultValue1
   • nyla_options.defaultValue2
   • nyla_options.defaultValue3
2. Add the value for each default product option for one or more products in your store (generally, if you're using this feature, you'd want to set it up for all products for consistency). The values should exactly match the name of the product option as it is exists in Shopify. (e.g. 34, Large or 12oz).
3. In order to have your product option default to having no value selected, add false to the corresponding metafield (instead of a named value).
4. If the value is left blank then no custom default value will be applied.

For example, consider a Shopify product with the following options: 

If we want Nyla to show 50ml as the default Size, and Morning as the default Shade everywhere this product appears on the site, after configuring metafields as described above, we'd see the following in Shopify:

NOTE: "Default Option 1" and "Default option 2" are just the backend names of the metafields in Shopify. If you were to click on each of those names, you would be able to see their namespace and keys are nyla_options.defaultValue1 and nyla_options.defaultValue2, correspondingly.

 

Specifying a product variant via a URL Query String

This feature enables your page to default to a specific product variant when a customer has clicked on a link containing the variant ID in the URL query string. The product variant is set directly after the page load. 

A common use case for this method is to direct advertising traffic directly to a specific variant that has been featured in the campaign.

Configuration instructions: 

To set this up, append a query string containing the Shopify variant ID onto your product page URL in this format: ?variant=variantID .

For example:

• Product page URL: https://mysite.com/products/my-product
• Should default to variant ID: 12345678910
• URL with query string: https://mysite.com/products/my-product?variant=12345678910

Note: This feature only works with product sources that are set to be a "PDP detail view". If your product page is using the page source, then this setting is set to on automatically, however if you are not referencing the page source, then you need to activate this setting inside the product source for this feature to work. 

Tip: You can retrieve the ID of the Variant from the URL in the Shopify admin when viewing the variant, see screenshot below:

SEO considerations: 

Using this method requires the browser to update the variant after the page has loaded for the customer. The default variant is initially rendered on the page and then changes to the variant ID in the URL. Given that most crawlers/etc execute javascript successfully, this method is deemed acceptable from an SEO and advertising standpoint.   

From an SEO standpoint, the query string is ignored; crawlers will thus use https://mysite.com/products/my-product directly, and the on-page JSON-LD schema contains information for all variants on the page. 

 

Limiting to a specific variant within the Source Product

This setting is used in cases where you want to limit a product source to show one variant only. For example, maybe you have a campaign where you only want to offer customers the chance to buy a white t-shirt (rather than pick from all of the colors for that t-shirt). This setting can also occasionally be used in features like upsells or gift with purchase, where a specific variant of the product is set deliberately.

To use this option, within source product, go to settings > single variant. You can then select in the dropdown which variant you want to limit the product to.

In this example, this instance of where the gel cleanser product is shown on the site will only include the 100ml variant and none of the others that exist in Shopify.  

 

Setting a default product variant in the Source Product settings

Another approach you can take is to configure a source product to default to a specific variant. This will only apply to the specific case it is configured in Nyla.

This is useful in cases where you want to default to a specific usage of a product to a variant. For example, in a specific campaign or blog page, you might want to feature the white version of a product default on the page, even though globally the product defaults to the red version. 

A benefit of this method is that the specifically selected variant is included in the pre-generated version of your page, so there is no "flicker" in the browser when you apply this method as there is with the previous approach.

You can configure this option from within source product > settings > default variant.