Disabling checkout until specifically tagged products meet minimum $ amount

Our store sells 2 types of products: Ready-Made products and Custom-Order products.

Customers can add both types of products to the same cart, but we want to require a minimum purchase amount for Custom-Order products of $400 while not requiring a minimum for Ready-Made products.

(Example: a customer wants to buy a $50 ready-made product as well as a few custom products. The value of those custom products must be $400 or more in order to proceed with the checkout, regardless of the value of the ready-made products they are buying.)

There are two things I could use help with:

  1. I would like to know how to disable checkout until the dollar amount of the products tagged “custom” has reached a minimum value of $400.
  2. I would also like to display text above the checkout button saying “Custom order $400 minimum not met.” This message would only display if products tagged “custom” are in the cart, and it should disappear when the minimum value of “custom” products is met.

Thanks in advance!

You can use JavaScript to disable the button until the cart has that value.

You can use the AJAX cart API to get the cart contents: https://shopify.dev/docs/api/ajax/reference/cart

The problem to solve is that the response from the cart API does not show product tags, so you’ll have to use something else (check the data in that link), maybe SKU for example. If it’s necessary to use tags, you could edit the add to cart functionality to add a “line item property” when adding a product, and add the tag there.

Use JavaScript for #2 as well, a simple conditional statement that if the cart contents from the API call in #1 don’t match, display an html div that was previously hidden.

By any chance, could you provide an example of the code to do this? I’m not experienced enough to know how to start. But I would greatly appreciate the help!