Hide Add to cart buttons

You can hide your Add to cart buttons on your storefront and reveal them again in the future.

Sectioned and non-sectioned themes

From your Shopify admin, go to Online Store > Themes.
Find the theme you want to edit, click the … button to open the actions menu, and then click Edit code.
In the Sections directory, click to open your product-template.liquid file. Find the HTML code for the Add to cart button. You can search for the word cart as a start.

The code for the add to cart button varies theme to theme. Look for an <input> or <button> tag with text like Add to cart, AddToCart, or add-to-cart.

In the Debut theme, the add to cart button code looks like this:

<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
  <span id="AddToCartText-{{ section.id }}">
    {% unless current_variant.available %}
      {{ 'products.product.sold_out' | t }}
    {% else %}
      {{ 'products.product.add_to_cart' | t }}
    {% endunless %}
  </span>
</button>

When you find the code, wrap it in Liquid {% comment %} and {% endcomment %} tags. This will stop the code from being displayed on your store, but will let you more easily put it back if you want to change your new template later.

Using the example above, the new code would look like this:

{% comment %}
<button type="submit" name="add" id="AddToCart-{{ section.id }}" {% unless current_variant.available %}disabled="disabled"{% endunless %} class="btn product-form__cart-submit{% if product.options.size == 1 and product.variants[0].title == 'Default Title' %} product-form__cart-submit--small{% endif %}">
  <span id="AddToCartText-{{ section.id }}">
    {% unless current_variant.available %}
      {{ 'products.product.sold_out' | t }}
    {% else %}
      {{ 'products.product.add_to_cart' | t }}
    {% endunless %}
  </span>
</button>
{% endcomment %}

Click Save to confirm your changes.

When you are ready to display your Add to cart buttons again, go back to your product-template.liquid file on the Edit HTML/CSS page, remove the {% comment %} and {% endcomment %} tags, and click Save.

From your Shopify admin, go to Online Store > Themes.
Find the theme you want to edit, click the … button to open the actions menu, and then click Edit code.
In the Templates directory, click to open your product.liquid file. Find the HTML code for the Add to cart button. You can search for the word cart as a start.

The code for the add to cart button varies theme to theme. Look for an <input> or <button> tag with text such as Add to cart, AddToCart, or add-to-cart.

In the Minimal theme, the add to cart button code looks like this:

<button type="submit" name="add" id="AddToCart" class="btn">
  <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>

When you find the code, wrap it in Liquid {% comment %} and {% endcomment %} tags. This will stop the code from being displayed on your store, but will let you more easily put it back if you want to change your new template later.

Using the example above, the new code would look like this:

{% comment %}
<button type="submit" name="add" id="AddToCart" class="btn">
  <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
</button>
{% endcomment %}

Click Save to confirm your changes.

When you are ready to display your Add to cart buttons again, go back to your product.liquid template on the Edit HTML/CSS page, remove the {% comment %} and {% endcomment %} tags, and click Save.

Hide Add to cart buttons

Sectioned and non-sectioned themes

Sectioned

Non-sectioned