How can I change text on variant selector when product is pre-selected?

Technical Q&A
1

Hello,

im trying to make a script to change text for id “texto-variante” when a variant is selected. i already make a script thats work when you press the variant but i need to show the text when you enter the product and the variant is already selected by default.

So when enter to the product the text with the id “texto-variante” is blank, but when i select a variant it change it.


        {% form 'product', product, class:form_classes, novalidate: 'novalidate' %}
           {% unless product.has_only_default_variant %}
  {% for option in product.options_with_values %}
    

      

                        

                      

      
      
        

         
      

      {% assign option_position = forloop.index %}
      
        {%- for value in option.values -%}
          

            - 
          

        {%- endfor -%}
      

    

  {% endfor %}
{% endunless %}

Hope someone can help me.

Regards,

2

Hello @Cpuga ,

Greetings from the Store Watchers Support Team! Happy to help you today.

To show the text when you enter the product page, you have to add the liquid code. In liquid you can get the default selected variant using product.selected_or_first_available_variant.

Now based on this you can add similar if conditions you have added in the JavaScript. It should be like :


{% if product.selected_or_first_available_variant.title == "57 g" %}
288 Tazas
{% elseif product.selected_or_first_available_variant.title == "454 g" %}
2889 Tazas
{% endif %}

I hope above solution helps you. Let me know if need further assistance :slightly_smiling_face:

Thanks,

Store Watchers Support Team

3

Hello @Cpuga ,

Kindly provide your store URL so that we can check the issue and provide the exact solution to you for the issue.

Based on your issue we have a similar example that can be helpful, please find it below.

Hope it helps. Let us know if you have any questions.

All the best,

CedCommerce

1 Like