Add "add to cart" button to collection page. If there's more than one variant, it adds a text link to the product page that says 'Select Options'. Otherwise it adds the first variant to the cart. If product is not available, show 'Sold Out' link instead.

add-to-cart-on collection-page.liquid

{% if product.available %}
  {% if product.variants.size > 1 %}
    <a href="{{ product.url | within: collection }}" class="btn" title="{{ product.title | escape }}">Select Options</a>
  {% else %}
    <form action="/cart/add" method="post">
      <input type="hidden" name="id" value="{{ product.variants.first.id }}" /> 
      <input type="submit" class="btn" value="Add to Cart" /> 
    </form>
  {% endif %}
{% else %}
    <a id="SoldOut" href="{{ product.url | within: collection }}" class="btn" title="{{ product.title | escape }}">Sold Out</a>
{% endif %}

 
<script>
  $( document ).ready(function() {
    $('#SoldOut').addClass('disabled').attr('disabled', 'disabled').fadeTo(200,0.5);
    $('#SoldOut').css({ cursor: "pointer" });
  });
</script>