Hide checkout or request quote button depending on cart content

This is an advanced guide

Overview

This tutorial will allow you to selectively hide either the checkout or request a quote button on your cart page. This is used if you want to sell both quotable and non quoteable items.

If they have at least one quoteable item in their cart, you want to send them to the request a quote page. From there they can still later checkout the non quoteable items.

If they only have non quoteable items in the cart, you don't want to show the request a quote button on the cart page.

This tutorial is for non ajax cart templates

Installation

Step 1: Paste the First Snippet

1. In your Shopify Admin, select Online Store from the vertical navigation menu on the left.
   
   
2. For your main theme (the theme at the top of the list), click the "Actions" button in the top right, and then click Edit Code.
   
   
3. On the left under Templates, navigate to cart.liquid.
   
   

4. At the very bottom of this file paste this code:

   <script type="text/javascript">var qqLineItemCollections = [];</script>
   {% for item in cart.items %}
   <script type="text/javascript">
    qqLineItemCollections.push({
    id: {{ item.id }},
    collections: {{ item.product.collections | json }}
    });
   </script>
   {% endfor %}

Step 2: Locate Your Cart Template, And Paste The Second Snippet

1. Find your actual cart template. It will either be in cart.liquid, or sections/cart-template.liquid. You're looking for the cart template that has most of the HTML. There is a chance it is in another location. The file will look something like this:

2. Find your checkout button which will look something like:
   

   <input type="submit" name="checkout" /> 

   
   Add a class to this button of "rq-checkout-btn". So that it looks something like this:
   

   <input class="rq-checkout-btn" type="submit" name="checkout" /> 

3. Find your request a quote button which will look like:
   

   <a href="/apps/request-quote?page=request">Request A Quote</a>

   
   Add a class of "request-quote" to this button. So that it looks something like this:
   

   <a class="request-quote" href="/apps/request-quote?page=request">Request A Quote</a>

Step 3: Save Your Work!

Now your cart page will either show checkout or request a quote depending on the contents of the cart.