Variants - Link product options

Highlighted
Community Manager
Community Manager
501 29 778

 


Update secondary menus in line with the current selection, to avoid showing unavailable combinations of options when a customer is choosing from multiple menus. In short, you don't want your customers to encounter this:

 

link-01.jpg


When your store's visitors make a selection in the first drop-down, you want the values in the second drop-down right below to be updated to list only those values that are available in combination with their first selection.

 

If a product has three options, you want the same to happen when one selects a value in the second drop-down. You want the values in the third drop-down to be updated to only list values that are available in combination with the two selections made above.

 

This works from top to bottom. Think of the typical "select a country then select a town" scenario. Selecting a country in the first country element updates the second town element to only contain towns found in that country.

 

Shopify does not give you linked options out of the box. It makes all choices in all drop-downs available. For example, all possible sizes will be listed in your Size drop-down and all colors will be listed in your Color drop-down, regardless what combinations exist or are in stock.

 

Linked options can be added to your theme in two steps.

 

  1. From your Shopify admin, go to Online Store > Themes.
  2. Find the theme you want to edit, and then click Actions > Edit code.
  3. Under Snippets, click the link Add a new snippet.
  4. Name your new snippet linked-options.

    link-02.png

  5. In your new snippet file, paste this code hosted on GitHub.
  6. Click Save.
  7. Under Layout, locate the file theme.liquid, and click it to open it in the code editor.
  8. Near the end of the file, right before the closing </body> tag, paste the following code:

    {% render 'linked-options' %}

    link-03.png

  9. Click Save.

TyW | Online Community Manager @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

6 Likes
Highlighted
New Member
1 0 0

I am very new to this but i followed the instructions exactly as posted and it is still offering options and showing them as unavailable.  I am using the venture theme if that matters.  Thank you in advance for your assistance.

0 Likes
Highlighted
Tourist
4 0 3

Has anyone been able to find a workaround with this for Themes where it doesn't work? Im currently using the Warehouse theme from Maestroo and it does not work with square icons or drop down list. Please help lol

2 Likes
Highlighted
New Member
1 0 0

Is there a solution for those of us that use Venture theme? Please help!

0 Likes
Highlighted
Tourist
11 0 1

@JayCDD wrote:

Has anyone been able to find a workaround with this for Themes where it doesn't work? Im currently using the Warehouse theme from Maestroo and it does not work with square icons or drop down list. Please help lol


Hi ,

 

I am also looking for answers. Using the same Warehouse theme  as @JayCDD . Hopefully , somebody can help.

1 Like
Highlighted
Tourist
6 0 4

Hey guys,

I am looking for a solution to this problem for Debut theme.

I really believe this should be solved by Shopify already, i have seen many post on this same subject, and it simply makes no sense to display options that are not available.

4 Likes
Highlighted
Explorer
49 5 10

Hi there,

 

Unfortunately if doesnt seem to be working on the narrative theme...any ideas!? Any help would be greatly appreciated.

& for everybody else reading this post, theres a great guy on utube outlining this issue & how to make the changes https://www.youtube.com/watch?v=vspWDu_POYA.

 

Regards,

:Paddy

@Padster 

 

 

0 Likes
Highlighted
Excursionist
13 0 5

I'm searching for this solution for the Debut theme.  Has anyone had any luck or found an app they can recommend to accomplish this? 

0 Likes
Highlighted
Explorer
49 5 10

Still searching.
How u getting on?

:Paddy

 

0 Likes
Highlighted