All Collections
Advanced Experiences App customizations
How can I prevent users from changing ticket quantity in their cart?
How can I prevent users from changing ticket quantity in their cart?

Edit your /cart liquid file to keep customers from changing their purchase quantity

Updated over a week ago

Even though our booking widgets won't let your customers buy more than you allow when you set up your Experience, they can change the quantity when they get to the /cart step. Stinkers!

It makes sense to keep your customers from changing the quantity in the /cart step of checkout when you are selling a pre-pay Experience booking. You may be strategically limiting the amount any one customer can buy to make room for other customers or simply don't want to oversell your Experiences inventory.

Every Shopify shop is set up differently, which means there are some things that we can't do automatically.  One of these things is customizing your store's cart to prevent customers from changing the quantity on bookings.  Luckily, with a bit of simple code we can remedy this issue!

TL;DR

  1. Add a unique product type to all your Experiences using the Shopify product editor.

  2. Edit your cart template file to remove the quantity changer for any product that matches the product type you don't want changed in the cart.

Heads up!  Editing code can sometimes be tricky and come with unintended consequences.  We are not responsible for broken code so edit at your own risk and make sure to make a backup!

Step 1: Set a Product Type and then Open Shopify's Code Editor

For any Shopify product in your store that is also an Experience, make sure you set a Product type that you can use to filter for experiences only later. 

Now that you've done that, it's time to tweak some code.

Shopify offers a built-in editor for modifying the code for your shop's theme.  On the left hand side, find the Online Store link.

Once there, you'll find your current theme towards the top.  Click the Actions drop down, and select Edit Code.

Great work!  On to the next step. 

Step 2: Find the Right Liquid File 

Your shop's theme is made up of many text files with a .liquid  suffix.  These are referred to as "Liquid" files, a special language designed for Shopify that mixes existing web languages with the data for your shop.  If you want more information on what "Liquid" is, you can click here to read Shopify's own documentation on it.

This part can be a bit tricky because the Liquid file containing the code we're looking for may vary depending on the theme.  The first place to look is the cart.liquid  file found under the Templates section.

There's a chance that the actual code for the cart items might exist elsewhere in another type of file called a "section" or a "snippet".  You can tell if this is the case if the code looks something like this:

{% section 'cart-template' %}

In this case, the file can be found under the Sections list in a file named cart-template.liquid.  If you're still struggling to find it, jump to the next step to see if you can locate the specific piece of code you'll need to edit.

Step 3: Edit the Code

Ok, we're nearly done!  We need to locate the line of code that renders the box where the quantity of an item can be changed.  To make this a bit easier, we can use the "find" feature.  Click in the box with all the crazy looking text and press cmd + f  on Mac or ctrl + f  on Windows.  Type name="updates[]" in the box that appears and press "enter".

You should see a line that looks like this: 

<input class="cart__qty-input" type="number" name="updates[]" id="updates_{{ item.key }}" value="{{ item.quantity }}" min="0" pattern="[0-9]*">

If it doesn't match that exactly, that's okay.  Not every theme will have the exact same code for this line.  

Alright, it's time to get a bit technical again.  We need to add some special "Liquid" code that will change how the cart page renders the quantity box.

We're going to add something called an if  tag.  Basically this tag says that if "type" of product is whatever you already chose it to be, then we'll just show the quantity for the line item.  Otherwise, we'll show the box that allows the customer to change the quantity.

In this case, the Shopify product type for this merchant's experience was set to "Event". If you made your product type "Experiences" or "Tours" or whatever, this is where you'd name that in the code.

{% if item.product.type == "Event" %}
  {{ item.quantity }}
{% else %}
  PUT THE INPUT LINE HERE
{% endif %}

Be sure the replace the PUT THE INPUT LINE HERE  with the <input ...  code found previously in this step!

Additionally, if you see a line above the <input ...  line that starts with <label you can include that line in between the {% else %} and {% endif %}  lines with the <input...  code. 

Step 4: Hit Save and Check It Out!

Find the Save button in the top right corner and click it.

Now book an event on your shop and head to your cart.  You should see something like this for you cart.

Did this answer your question?