Make choose options button go to product page instead of pop up in taste theme

[jkjcreative]

I have the Taste theme and in all my collections sections through the site, I want the 'choose options' button to link and go directly to the product page instead of the pop up coming up.

I'd like to know what code to add/change to make this happen in the Taste theme.

Thanks!

[Guleria · Accepted solution]

Hello @jkjcreative ,

Follow these steps:
1) Edit Snippet -> card-product.liquid
2) Search for code 

<modal-opener data-modal="#QuickAdd-{{ card_product.id }}">
                <button
                  id="{{ product_form_id }}-submit"
                  type="submit"
                  name="add"
                  class="quick-add__submit button button--full-width button--secondary{% if horizontal_quick_add %} card--horizontal__quick-add animate-arrow{% endif %}"
                  aria-haspopup="dialog"
                  aria-labelledby="{{ product_form_id }}-submit title-{{ section_id }}-{{ card_product.id }}"
                  data-product-url="{{ card_product.url }}"
                >
                  {{ 'products.product.choose_options' | t }}
                  {%- if horizontal_quick_add -%}
                    <span class="icon-wrap">{% render 'icon-arrow' %}</span>
                  {%- endif -%}
                  {%- render 'loading-spinner' -%}
                </button>
              </modal-opener>

Replace it with 

<modal-opener {% comment %}data-modal="#QuickAdd-{{ card_product.id }}" {% endcomment %}>
                <a href="{{ card_product.url }}" style=" text-decoration: none; ">
                <button
                  id="{{ product_form_id }}-submit"
                  type="submit"
                  name="add"
                  class="quick-add__submit button button--full-width button--secondary{% if horizontal_quick_add %} card--horizontal__quick-add animate-arrow{% endif %}"
                  aria-haspopup="dialog"
                  aria-labelledby="{{ product_form_id }}-submit title-{{ section_id }}-{{ card_product.id }}"
                  data-product-url="{{ card_product.url }}"
                >
                  {{ 'products.product.choose_options' | t }}
                  {%- if horizontal_quick_add -%}
                    <span class="icon-wrap">{% render 'icon-arrow' %}</span>
                  {%- endif -%}
                  {%- render 'loading-spinner' -%}
                </button>
                </a>
              </modal-opener>

Thanks

[jkjcreative]

Hi Guleria, thank you for responding. I replaced the code, however this error pops up on the choose options button, but the button does go to the product page, just button doesn't say 'choose options' anymore - here's the test site I'm working in https://xca2y0g7wnbbdsij-64232325354.shopifypreview.com :

Here's where I replaced with the new code:

 

This was the orignal code:

The live site is Maxxherb.com

 

 

[jkjcreative]

Hi Guleria, Fixed it! I just took out this line of the new code:  {%- render 'loading-spinner' -%} 

And it works now! Thank you so much!