How to add/show the (available) sizes below the items with Prestige Theme?

Topic summary

A user seeks to display available product sizes (e.g., S, M, XL or numerical sizes) beneath product items in the Prestige Shopify theme, similar to how Yoox.com presents them.

Main Challenge:

  • Found Liquid code snippets that work for standard “Size” variants, but needs a solution that accommodates different Option1 Name values (Size, Waist, etc.)
  • Cannot locate the product-grid-item.liquid file where code should be placed
  • Needs a universal term or method to capture all Option1 values regardless of naming

Current Status:

  • Original poster created a workaround by manually including all Option1 Names, which functions but is described as “ugly”
  • Added CSS to cross out and gray out sold-out sizes
  • Another user (KB909) is seeking the same solution and requested details about implementation

Outstanding Issues:

  • A third user (cashmerecasper) reports that implementing the code places sizes to the right of product images instead of below, creating unwanted spacing in the product grid
  • Specific file locations and complete code implementation remain unclear for others attempting to replicate the solution
Summarized with AI on November 13. AI used: claude-sonnet-4-5-20250929.

Good Day,

i am struggling with the following: I am using the Prestige Theme and want to show the available sizes below the items.



Item1



S M XL XXL



Item2



52 54 56



Item3



UNI

See the link below

Yoox Link

I have found some solutions, but it only said/works with sizes. As I have worked with differed wording in the first “Size” field (Option1 Name): such as Size, Waist, etc.

So:

Option1 Name Option1 Value

May someone share the code for me and where to place it. Or show me a documentation how to do that.

A lot of code has to be pasted into: **product-grid-item.liquid (**which I don’t find)

{% assign sizes = '' %}
      {% for variant in product.variants %}
        {% if variant.available %}
        {% assign sizes = sizes | append: variant.options[0] | append: '_' %}
       {% endif %}
      {% endfor %}
      
      {% assign sizesArr = sizes | split: '_' | uniq %}
      
      {% for size in sizesArr %}
        {{ size }}
      {% endfor %}

This I have found.

May someone assist me?

Thank you


Edit.

This code works, but, is there a term I can insert in shopify to display all values I inserted into Option1 Name? Or Do I have to put in all values by hand?

{%- assign avail_variants = '' -%}
          {%- for variant in product.variants -%}
            {%- if variant.available -%}
            {%- assign avail_variants = avail_variants | append:', ' | append: variant.title | downcase -%}
            {%- endif -%}
          {%- endfor -%}
          {%- capture product_sizes -%}
            {%- for option in product.options_with_values -%}
            {%- assign downcase_option = option.name | downcase -%}
            {%- if downcase_option == 'size' -%}
                
                  {%- for value in option.values -%}
                    {%- assign downcase_value = value | downcase -%}
                    {%- if avail_variants contains downcase_value -%}
                    - {{ value }}
                    

                    {%- else -%}
                    - {{ value }}
                    
                  {%- endif -%}
                  {%- endfor -%}
                

             {%- endif -%}
            {%- endfor -%}
          {%- endcapture -%}

          {%- if product_sizes != blank -%}
            
              {{ product_sizes }}
            

          {%- endif -%}

No one knows if there is a unifying term to include allo option 1 values?

Hello, do you have any updates regarding your question?

I would be very much interested since I am looking for the same solution.

Thank you! Katrin

Hi, I made an ugly solution, included all Names within, and now it works.

Some CSS and I crossed out and smallened the sizes of sold-out items.

Best

Thank you for the quick response. Would you mind sharing your solution? I.e. wich piece of code did you use in wich file?

What is your store URL so I may look at it?

Thank you!!

Hello Flo,

thanks for DM, unfortunately I cannot reply that is why I do write here. Your solution looks perfect.

Did you use the piece of code that you mentioned above? And where did you paste it?

I would appreciate your help!

Thank you,

Katrin

just write me a DM.

best

Hello! I tried to implement this code within the Prestige theme and it puts the available size (variant option 1) on the right side of the picture instead of below, creating space between the products within the product grid. Any advise? Your expertise is highly appreciated! Kind regards, Casper