Add to cart with variants on Collection Page

[GaryBusey1]

I’ve managed to get ATC buttons on my collection page

But I need it to allow selection of variants, because right now it just adds the first variant.

how do i do this??

Thank you!!!

[GaryBusey1]

I have managed to get variants with the below code…

But they look super ugly… is there a way I can get the dropdown to say “Select Variant”

{% if product.variants.size > 1 %}

{% for variant in product.variants %} {% if variant.available %} {{ variant.title }} {% else %} {{ variant.title }} - {{ ‘products.product.sold_out’ | t }} {% endif %} {% endfor %}

{% else %}

{% endif %}

{% if product.available %}

Add To Cart

{% else %}

Out of Stock

{% endif %}

[KetanKumar]

@GaryBusey1

Thanks for your question.

Please share your site URL,
So I will check and provide a solution here.