I'm new to Liquid, however I'm coming from a Frontend/Backend development background so I will understand if anyone suggested low level solution.
here is my store url
https://thevalleyofart.com.au/collections/all/products/sunset-canvas
you will notice that the default selected variation is the first one which is the smallest Canvas, while I want the pre-selected variation to be the latest one as its the biggest canvas 100x70 which makes the artwork clear to view.
I think the piece of code to be changed is around should be in that file featured-product.liquid but not sure where exactly.
<div class="input-row">
{% if product.variants.size > 1 %}
<div class="option-selectors">
{% for option in product.options_with_values %}
<div class="selector-wrapper styled-select {% if settings.swatch_enabled and option.name == settings.swatch_option_name %} swatches option--{{ settings.swatch_option_name | handle }}{% endif %}" {% if settings.variant_style == 'listed' %}data-make-box{% endif %}>
<label for="{{ section.id }}-SingleOptionSelector-{{ forloop.index0 }}">
{{ option.name }}
</label>
<select
id="{{ section.id }}-SingleOptionSelector-{{ forloop.index0 }}"
data-single-option-selector
data-index="option{{ option.position }}"
{% if settings.variant_style == 'listed' %}data-listed{% endif %}
{% if settings.swatch_enabled and option.name == settings.swatch_option_name %}data-colour-swatch="true"{% endif %}>
{% for value in option.values %}
<option
value="{{ value | escape }}"
{% if option.selected_value == value %}selected="selected"{% endif %}>{{ value }}</option>
{% endfor %}
</select>
{% if settings.show_size_chart and option.name == settings.size_chart_variant %}
<div class="size-chart-container">
<a href="{{ pages[settings.size_chart_page].url }}" target="_blank" class="size-chart-link">
{{ 'products.product.size_chart' | t }}
</a>
<div class="size-chart-content hidden">
<div class="size-chart">
<div class="size-chart__inner user-content">
{{ pages[settings.size_chart_page].content }}
</div>
</div>
</div>
</div>
{% endif %}
</div>
{% endfor %}
</div>
<select name="id" class="original-selector" aria-label="{{ 'products.product.selector_label' | t | escape }}">
{% for variant in product.variants %}
<option value="{{ variant.id }}"
{% if variant == current_variant %} selected="selected"{% endif %}
{% if section.settings.show_inventory_notice and variant.inventory_management == 'shopify' and variant.inventory_quantity > 0 %}
{% if section.settings.inventory_notice_threshold == 0 or variant.inventory_quantity <= section.settings.inventory_notice_threshold %}
data-inventory="{{ variant.inventory_quantity }}"
{% endif %}
{% endif %}
data-stock="{% if variant.inventory_management == 'shopify' and variant.inventory_quantity <= 0 %}out{% endif %}">
{{- variant.title | escape -}}
</option>
{% endfor %}
</select>
{% else %}
<input type="hidden" name="id" value="{{ current_variant.id }}" />
{% unless product.has_only_default_variant %}
<div class="singleopt">
{% for option in product.options %}
{% assign opt_idx = 'option' | append: forloop.index %}
<label>{{ option }}: {{ product.variants.first[opt_idx] }}</label>
{% if settings.show_size_chart and option == settings.size_chart_variant %}
<div class="size-chart-container">
<a href="{{ pages[settings.size_chart_page].url }}" target="_blank" class="size-chart-link">
{{ 'products.product.size_chart' | t }}
</a>
<div class="size-chart-content hidden">
<div class="size-chart">
<div class="size-chart__inner user-content">
{{ pages[settings.size_chart_page].content }}
</div>
</div>
</div>
</div>
{% endif %}
{% endfor %}
</div>
{% endunless %}
{% endif %}
</div>
User | Count |
---|---|
551 | |
209 | |
126 | |
79 | |
44 |