Hide Add to Cart (template)

Sale price Price $160.00 Regular price

Do you need to disable the Add to Cart button on certain products? This is commonly used for products that need to have quotes or communication with the business or client before purchase. 

To hide the Add to cart button on products, first thing you should create a custom product template for that product. 

First step is to go to Online Store in your Shopify admin, and choose Themes. In the themes settings find the theme you want to edit and click on Actions, and from the drop-down menu choose Edit code. 

Find the Templates directory and click on Add a new template. Create a product template by selecting the product from the drop-down menu, give your new template a name requires-contact and click on Create template. Find 

{% section 'product-template' %}

and replace it with 

{% section 'product-template-requires-contact' %}


Click on Save.

Next thing is to create a new product section. So navigate to Sections directory and click on Add a new section. Give your new section the name product-template-requires-contact and click on Create section. Delete all the default code in the file so that the file is completely empty.

Go back to the Sections directory and copy all the content from the product-template.liquid file and paste it to the newly made product-template-requires-contact.liquid section. And Save your work. 

In product-template-requires-contact.liquid section file find the HTML code for Add to cart button. The easiest way is to search for the word cart in the file. The Add to cart code varies from theme to theme but in most cases you can find it under <input> or <button> tag with the text Add to cart. When you successfully found the code, wrap it in the Liquid {% comment %} and {% endcomment %} tags and click on Save. This will essentially forbidden the code ti be shown on your store, but it will allow you to put it back whenever you need it.

If you want to add a contact form to your new product template go to the Templates directory and click on page.contact.liquid. Search for {% form 'contact' %} tag in the file and copy all of the code. Go back to product-template-requires-contact.liquid file and search for the closing </form> tag. On a new line under this tag paste the code from the contact form. Wrap the code in HTML div tags by pasting the following code on a new line above {% form 'contact' %} 

<div class="form-vertical">

And on a new line below {% endform %} past this code 

</div>

And save your work. 

Last step is to assign your new template to a product and it is done by navigating to the Products in the Shopify admin and choosing All Products. Find the product you want to hide Add to cart button, and on the product page find Theme templates. On the Template suffix drop-down choose requires-contact and click on Save. Repeat these steps for each product you want to add your new template, and after you done all of this, you are good to go!


We can make a Product template that hides or disables the button, and you can apply it to the products that need it. 

Client Reviews

x

Get in touch

Let us know about your project and will get back to you within 24hrs. If you'd rather speak to someone now

Call +971 4383 5588

By submitting this form you agree that Eastside Co. can contact you by the email address and
telephone number provided above. You may unsubscribe from these communications at
anytime. For information on how to unsubscribe, as well as our privacy practices and
commitment to protecting your privacy, check out our Privacy Policy.

What our clients say

Great service, pleased with the finished product. Account management has been great, and very helpful. Very happy with the overall experience - would recommend to anybody looking to create or update their Shopify web store.

Wasps Rugby Club