Brooklyn theme : How can I prevent certain combination of items to be in the cart?

Solved
Johkid
Excursionist
16 0 9

The homepage is still under construction, so I will leave a prototype link 

https://ww7afogzt3f1u917-51704823974.shopifypreview.com

 

I was wondering, are there anyways to not to be able to select items with a certain item?

For example, on the homepage, there is a section called "group buys". This item takes time to be made and be delivered (about 6 months)

In the other section, we have something called "shop". This section is for the items which are "in-stock".

So, What I want to do is to prevent in-stock items and the group buy items to be mixed. In other words, if the customer selects the group to buy the item, he/she won't be able to select the "in-stock" item. Vice versa as well.

Could you help me out with this?

0 Likes

This is an accepted solution.

Hi @Johkid 

This solution requires editing of your theme code. Most of the files that make up a theme contain Liquid, Shopify's templating language. Theme files also contain HTML, CSS, and JavaScript. Edit the code for a theme only if you know HTML and CSS, and have a basic understanding of Liquid. To know more what is theme editing, please visit:

https://help.shopify.com/en/manual/online-store/os/using-themes/managing-themes/duplicating-themes

Before you customize your theme, it's a good idea to duplicate your theme to create a backup copy. This makes it easy to discard your changes and start again if you need to.

Steps to duplicate a theme:

1. From your Shopify admin, go to Online Store > Themes.

2. For the theme that you want to duplicate, click Actions > Duplicate.

 

Solution of your specific issue:

This solution has two parts. After full implementation, if anyone has already added items of Group Buys in the cart then the product page of Shop items will display a warning message as below in place of Add to cart buttons:

This is a regular Shop item which can not be ordered together with Group Buys. You already have some Group Buys in your cart.

Similarly, if anyone has already added a Shop item in the cart then the product page of Group buys will display a warning message as below in place of Add to cart buttons:

This is a Group Buy which can not be ordered together with regular Shop items. You already have some regular Shop items in your cart.

Thus preventing buyers to accidentally order both type of items. The code only checks first item of the cart to determine what type of items is already in the cart for speed purpose. Assuming, buyer has started with a empty cart. While testing, if you already have added any items to cart, please empty your cart first then begin testing.

Part - I:

You will first need to add certain tag to each product so they can be distinguished by theme code.

> Add the tag 'Shop Item' to all your in-stock 'Shop' items.

> Add the tag 'Group Buy' to all items of 'Group Buys'.

Example screenshot:

SumanSaurabh_0-1611995834064.png

In order to know more about how to add product tags, please visit:

https://help.shopify.com/en/manual/shopify-admin/productivity-tools/using-tags#add-a-tag

 

Part - II:

1. From your Shopify admin, go to Online Store > Themes.

2. Find the theme you want to edit, and then click Actions > Edit code.

3. In the Snippets directory, click Add a new snippet.

4. Name your snippet cart-check, and click Create snippet.

5. In cart-check.liquid file, copy and paste the following code snippet then save the file:

 

{%- assign cart_type = '' -%}
{%- if cart.items[0].product.tags contains 'Shop Item' -%}
  {%- assign cart_type = 'Shop Item' -%}
{%- elsif cart.items[0].product.tags contains 'Group Buy' -%}
  {%- assign cart_type = 'Group Buy' -%}
{%- endif -%}
{% if product.tags contains 'Shop Item' and cart_type == 'Group Buy' %}
  <p style="color:red">This is a regular Shop item which can not be ordered together with Group Buys. You already have some Group Buys in <a href="/cart">your cart</a>.</p>
  <style>.product-single__add-to-cart {display: none;}</style>
{% elsif product.tags contains 'Group Buy' and cart_type == 'Shop Item' %}
  <p style="color:red">This is a Group Buy which can not be ordered together with regular Shop items. You already have some regular Shop items in <a href="/cart">your cart</a>.</p>
  <style>.product-single__add-to-cart {display: none;}</style>
{% endif %}

 

 

6. In the Sections directory, click to open your product-template.liquid file.

7. In the product-template.liquid file, find the code line that begins with <div class="product-single__add-to-cart 

8. Then copy and paste the following code just above/before this line <div class="product-single__add-to-cart 

 

{% include 'cart-check'%}

 

 9. Save the changes.

I hope this helps.

Thanks!

 

Suman Saurabh | Expert in Shopify Development
✅ Was my reply helpful? Please Like & Accept Solution
✅ Want to hire me? Send PM or Skype: omnisitecreations
0 Likes
Gorundworkers
New Member
1 0 0

you can find me on the NJ Groundworks LTD website and contact us now.
Get Ready for Summer!

0 Likes