How can I turn off the auto select variant feature in the Dawn theme?

Store Design
1

How do I Disable Auto Select Variant Dawn theme? I tried looking around the code, but could not find the option. Also, the option does not exist on the product page inside the theme customizer. Thanks!

1 Like
2
  1. In the code editor, navigate to the sections/product-template.liquid file.
  2. Look for the code block that handles the variant selection. It usually starts with something like {% if product.variants.size > 1 %}.
  3. Inside that code block, locate the line that includes the selected attribute. It might look like <option value="{{ variant.id }}" {% if variant == selected_variant %}selected{% endif %}>.
  4. Remove the selected attribute from that line.
3

What if there is no product-template.liquid file

1 Like
4

Did you find the solution to disable auto variant selection on products? Share with us, please! I have the same problem.

1 Like
5

Is there a solution that works on Dawn version 11?

Thanks

6

Can someone provide clear instructions for non-coders?

I don’t know what an attribute is, please give the line of code that needs to be pasted in place of the old one

1 Like
7

Figured this out for a client. Their specific request was for the radio-button variant options, other option styles such as swatch and dropdown is similar but slightly different.

The file you are looking to modify is:

Snippets/product-variant-options.liquid

The code for the radio button in that file by default is (LoC 85-102):

{%- elsif picker_type == 'button' -%}

You want to remove the following lines:

{% if option.selected_value == value %}
  checked
{% endif %}

Why this works; since liquid renders HTML server side before it goes to the client this code has nothing to do with the actual selection (click/change) it is purely for initial render (load). By removing the checked value from the liquid render logic then the HTML is rendered without the checked option. However the variant buttons still work and when selected they show as such.

FOLLOWING SUGGESTIONS ARE UNTESTED OBSERVATIONS OF THE CODE!!

For the dropdown, I would experiment with (remove) this segment:

{% if option.selected_value == value %}
  selected="selected"
{% endif %}

For the swatch, I would experiment with (remove) this segment:

{% if option.selected_value == value %}
  {% assign checked = true %}
{% endif %}

This should unset the checked value for the nested swatch render element, however more may need to change in this block, this is untested!

{%
  render 'swatch-input',
  id: input_id,
  name: option.name,
  value: value | escape,
  product_form_id: product_form_id,
  checked: checked,
  disabled: option_disabled,
  shape: block.settings.swatch_shape,
  help_text: label_unavailable
%}

If changing these swatch statements are not working, look at the following file to remove the default selection.

Snippets/swatch-input.liquid

Again, please test these changes with development stores, not-live themes or preview before pushing to a live store.

8

I can’t find these code on dawn theme version 15
file name

Snippets/swatch-input.liquid

{% if option.selected_value == value %} {% assign checked = true %} {% endif %}

9

Hi, it worked for my shop, but now when i select a variant the image appear but the variant isn’t highlight anymore. Do you have a solution ?

10

Yes I got the solution.