Disable Variantpicker for Products with one Variant

[Incivtus]

Hello,
I have a store for clothing via a POD provider with the Dawn theme. Since we have treated variants of products as separate products, as the print colors vary for the colors of the shirts, there is only one selection to make for the “Color” option. We have set up the Colorswatches via the King Products Options & Variant app. Everything works so far. However, as there was still a problem with the individual variant, I added the following code to “product-variant-picker.liquid”: 

{%- elsif picker_type == 'button' -%}       
        {%- if option.name == 'Farbe' or option.name == 'Color' -%}
          {%- else -%}
            <fieldset class="js product-form__input product-form__input--pill">
              <legend class="form__label">{{ option.name }}</legend>
              {% render 'product-variant-options',
                product: product,
                option: option,
                block: block,
                picker_type: picker_type
              %}
            </fieldset>
          {%- endif -%}

Now there is only the picker for the size and the swatches of the app for the color. The problem now, however, is that I can only change the color and not the size, as every other size is displayed: Not available. If I comment out my IF statement, everything works again.

Now my question:
Is there another better way or do you have any ideas how I can fix this with the current implementation?

Thank you very much,
Bastian - Invictus Streetwear

[Easify-Mark]

Hi @Incivtus,

I’d like to suggest a couple of improvements for your store:

1. Hide Single-Variant Color Option: Since the Color option has only one variant, consider adding custom code to hide it on the product page. This keeps it functional but hidden, creating a cleaner look. Your app team should assist with this.

2. Reorder Options: I recommend moving the Color option to the first position, followed by Size. Since Color acts as a switch between different products, selecting it first minimizes the need to reselect Size when customers change the color. This adjustment aligns with the typical top-to-bottom selection flow and reduces potential confusion.

Currently, with Size listed first, if customers choose a Size and then decide to change the Color, the page reloads, and they need to reselect the Size. This could lead to confusion, as customers might forget to reselect the Size, assuming it was already chosen.

Below is an example of how you can rearrange the option positions:

I'm from Easify Product Options, which also offers similar cross-product linking functions for POD stores and has helped many customers with similar challenges. I hope my suggestions are helpful for your store, and perhaps one day, our app could support your needs as well 🤗.