Disable add to cart & slide out cart
This article will guide you on how to disable add to cart and the slide out cart that will appear automatically on the right side when customers add product to cart. This guide is applicable for Wave, Fall, X-Force, Maker and Lucky theme only
Disable add to cart & slide-out cart
Enable slide-out cart
Change shopping cart font size
Disable the auto cart preview when every product added (apply to all theme)
Rename the “shipping, taxes & discounts will be calculated at checkout” on cart
⚠️ Kindly take note :
Above all code editing, you will need to re-edit the code again if you switch to a new theme template
Different themes will have different slide-out cart
Some theme does not have slide-out cart
We do not allow to change or edit the code for the checkout page (which include shipping & payment method) due to security reasons
📌Note: This step comes before the Candy theme, example: X-force, Prisme, DOUX, & etc. For newer themes, may refer to the step in the next section.
Step 1: Go to EasyStore Admin > Channels > Online Store > Edit source and reset the 3 files below :
theme.js
cart-drawer.liquid
related-products.liquid
For mobile view, there's add hide text within it.
a. Go to edit source > snippets > product-grid-item.liquid > search for:
{% if sold_out == false and product.price > 0 and settings.home_page_add_to_cart == true %} (around row 63)
b. Add hide behind addToCartList float-btn btn small--hide medium--hide
c. Add hide behind float-btn btn small--hide medium--hide
d. Search for: {% if sold_out == false and product.price > 0 and settings.home_page_add_to_cart == true %} (around row 103)
e. Add hide behind addToCartList btn btn--outline large--hide
f. Add hide behind btn btn--outline large--hide
Step 2 : Save and you are done.
📌Note: This step is for the newer theme for example: Aroma, Kiddy, Vivid & etc. For older themes, may refer to the step above.
Step 1 : Go to EasyStore Admin > Channels > Online Store > Edit source > main-product.liquid
Step 2 : Remove the code section as shown in the image below
Step 3 : Save and you are done.
Step 1 : Go to EasyStore Admin > Channels > Online Store > Edit source > theme.js
Step 2 : Change the // toggleCart(); to toggleCart(); around line 109
💡 Tips : You can remove popToast(add_cart_success_html) if don't want to have a popup message when added product to cart
Step 3 : Go to line 300 - 320 and change the // toggleCart(); to toggleCart();
Step 4 : Save
Step 1: Go to EasyStore Admin > Channels > Online Store > Edit source > assets > theme.scss
Step 2 : Look for cart-drawer-wrapper around line 4197 > change the font size
Step 3 : Save and you're done!
Step 1 : Go to Channels > Online Store > Edit Source > select theme.js file
Step 2 : remove these 2 line of theme.toggleCart(); around line 115 and 319
Step 3 : Save
Before :
After :
Step 1 : Click into Channels > Online Store > Edit Source > select cart-drawer.liquid file
Step 2 : Look for <p><em>{{ 'cart.general.shipping_at_checkout' | t }}</em></p> around line 470 and change the text here
Step 3 : Save
💡 Tips : If you do not want this wording to appear on the cart, you can remove the code <p><em>{{ 'cart.general.shipping_at_checkout' | t }}</em></p>
In this article :
Disable add to cart & slide-out cart
Enable slide-out cart
Change shopping cart font size
Disable the auto cart preview when every product added (apply to all theme)
Rename the “shipping, taxes & discounts will be calculated at checkout” on cart
⚠️ Kindly take note :
Above all code editing, you will need to re-edit the code again if you switch to a new theme template
Different themes will have different slide-out cart
Some theme does not have slide-out cart
We do not allow to change or edit the code for the checkout page (which include shipping & payment method) due to security reasons
1. Disable add to cart & slide out cart
📌Note: This step comes before the Candy theme, example: X-force, Prisme, DOUX, & etc. For newer themes, may refer to the step in the next section.
Step 1: Go to EasyStore Admin > Channels > Online Store > Edit source and reset the 3 files below :
theme.js
cart-drawer.liquid
related-products.liquid
For mobile view, there's add hide text within it.
a. Go to edit source > snippets > product-grid-item.liquid > search for:
{% if sold_out == false and product.price > 0 and settings.home_page_add_to_cart == true %} (around row 63)
b. Add hide behind addToCartList float-btn btn small--hide medium--hide
c. Add hide behind float-btn btn small--hide medium--hide
d. Search for: {% if sold_out == false and product.price > 0 and settings.home_page_add_to_cart == true %} (around row 103)
e. Add hide behind addToCartList btn btn--outline large--hide
f. Add hide behind btn btn--outline large--hide
Step 2 : Save and you are done.
📌Note: This step is for the newer theme for example: Aroma, Kiddy, Vivid & etc. For older themes, may refer to the step above.
Step 1 : Go to EasyStore Admin > Channels > Online Store > Edit source > main-product.liquid
Step 2 : Remove the code section as shown in the image below
Step 3 : Save and you are done.
2. Enable slide-out cart
Step 1 : Go to EasyStore Admin > Channels > Online Store > Edit source > theme.js
Step 2 : Change the // toggleCart(); to toggleCart(); around line 109
💡 Tips : You can remove popToast(add_cart_success_html) if don't want to have a popup message when added product to cart
Step 3 : Go to line 300 - 320 and change the // toggleCart(); to toggleCart();
Step 4 : Save
3. Change shopping cart font size
Step 1: Go to EasyStore Admin > Channels > Online Store > Edit source > assets > theme.scss
Step 2 : Look for cart-drawer-wrapper around line 4197 > change the font size
Step 3 : Save and you're done!
4. Disable the auto cart preview when every product added (apply to all theme)
Step 1 : Go to Channels > Online Store > Edit Source > select theme.js file
Step 2 : remove these 2 line of theme.toggleCart(); around line 115 and 319
Step 3 : Save
Before :
After :
5. Rename the “shipping, taxes & discounts will be calculated at checkout” on cart
Step 1 : Click into Channels > Online Store > Edit Source > select cart-drawer.liquid file
Step 2 : Look for <p><em>{{ 'cart.general.shipping_at_checkout' | t }}</em></p> around line 470 and change the text here
Step 3 : Save
💡 Tips : If you do not want this wording to appear on the cart, you can remove the code <p><em>{{ 'cart.general.shipping_at_checkout' | t }}</em></p>
Updated on: 05/10/2023
Thank you!