Configuration discount code with Ajax Cart

Find your theme from the below list to add the Ajax code to your theme.

Debut theme:

Ajax cart discount will attempt to install its code in your theme coding.

For the AJAX cart, you have to edit theme.js. please follow these steps:

Step 1: From Shopify’s admin, select Online Store, then Actions > Edit code.

Step 2: Find the theme.js from

Step 3: Open the theme.js file.

Step 4: Press Ctrl + F / Command + F to enable the search code input box, Now find the “state.total_price” code in theme.js

Step 5: Replace with this code

'<span class="csapps-cart-original-total">'+theme.Currency.formatMoney(
state.total_price,
theme.moneyFormatWithCurrency
) +'</span>';

Here is the before and after code screenshot:

Boundless theme:

Please follow these steps:

Step 1: From Shopify’s admin, select Online Store, then Actions > Edit code.

Step 2: Go to the assets and find theme.js.liquid

Step 3: Open theme.js.liquid file.

Step 4: Press Ctrl + F / Command + F to enable the search code input box, Now find the “cart.total_price” code in theme.js.liquid

Step 5: Replace with this code in 2 places.

1. '<span class="csapps-cart-original-total">'+Shopify.formatMoney(cart.total_price, settings.moneyFormat)+'</span>',

Here is the before and after code screenshot:

2. '<span class="csapps-cart-original-total">'+Shopify.formatMoney(cart.total_price, settings.moneyFormat)+'</span>'

Here is the before and after code screenshot:

Narrative theme:

Please follow these steps:

Step 1: From Shopify’s admin, select Online Store, then Actions > Edit code.

Step 2: Go to the first theme.js / theme.min.js from Asset.

Step 3: Open theme.js and theme.min.js files.

Step 4: First go to the theme.js and press Ctrl + F / Command + F to enable the search code input box, Now find “state.total_price” in theme.js

Step 5: Replace with this code

'<span class="csapps-cart-original-total">'+currency.formatMoney(state.total_price, theme.moneyFormat)+'</span>'

Here is the before and after selected code screenshot:

Step 6: Now go to theme.min.js and press Ctrl + F / Command + F to enable the search code input box, Now find “total_price” in theme.min.js

Step 7: Replace with this code

'<span class="csapps-cart-original-total">'+G.formatMoney(e.total_price,theme.moneyFormat)+'</span>'

Here is the before and after code screenshot:

Venture theme:

Please follow these steps:

Step 1: From Shopify’s admin, select Online Store, then Actions > Edit code.

Step 2: First go to the cart-template.liquid under sections

Step 3: Open cart-template.liquid file.

Step 4: Press Ctrl + F / Command + F to enable the search code input box, Now find “{{{totalPrice}}}” in cart-template.liquid

Step 5: Replace with this code

<span class="csapps-cart-original-total">{{{totalPrice}}}</span>

Here is the before and after code screenshot:

Express theme:

Please follow these steps:

Step 1: From Shopify’s admin, select Online Store, then Actions > Edit code.

Step 2: Go to the first theme.js / theme.min.js from Asset.

Step 3: First Open the theme.js file.

Step 4: Press Ctrl + F / Command + F to enable the search code input box, Now find “formattedCartPrice” in theme.js

Step 5: Replace with this code

'<span class="csapps-cart-original-total">'+formattedCartPrice+'</span>'

Here is the before and after code screenshot:

Step 6: Now go to theme.min.js and press Ctrl + F / Command + F to enable the search code input box, Now find “this.elements.cartPrice.forEach” in theme.min.js

Step 7: Replace “e” with the below code

'<span class="csapps-cart-original-total">'+e+'</span>'

Here is the before and after code screenshot:

Brooklyn theme:

Please follow these steps:

Step 1: From Shopify’s admin, select Online Store, then Actions > Edit code.

Step 2: Go to the first ajax-cart-template.liquid from snippets

Step 3: Open cart-template.liquid file.

Step 4: Press Ctrl + F / Command + F to enable the search code input box, Now find “{{{totalPrice}}}” in cart-template.liquid

Step 5: Replace with this code

<span class="csapps-cart-original-total">{{{totalPrice}}}</span>

Here is the before and after code screenshot:

Debutify theme:

Snippets/cart-page.liquid, templates/cart.ajax.liquid

Step 1: From Shopify’s admin, select Online Store, then Actions > Edit code.

Step 2: Go to the first cart-page.liquid from snippets and then cart.ajax.liquid from the template

Step 3: Press Ctrl + F / Command + F to enable the search code input box, Now find “cart.total_price” in the “cart-page.liquid & cart.ajax.liquid”

Old code:

<p class="cart__subtotal text-money spacer-bottom-none text-large" data-cart-total><span class="money">{{ cart.total_price | money }}</span></p>

Step 4: Replace with this code

<span class="csapps-cart-original-total"><p class="cart__subtotal text-money spacer-bottom-none text-large" data-cart-total><span class="money">{{ cart.total_price | money }}</span></p></span>

Note: Disable the checkout button cost from settings for this theme.

Step 5: Put css in assets/theme.scss.liquid

#CartContainer .csapps-cart-total {
display: inline-block !important
}
.csapps-cart-total {
margin-left: 5px
}
.csapp-discount-list .discount .dis-text {
color: #63c17d !important
}
#CartContainer .mini_cart .csapp-discount-list .discount-label-conatiner {
display: flex !important
}
.csapp-discount-list .discount svg path {
fill: #63c17d !important
}
.csapp-discount-list .discount .dis-name {
align-items: center
}
.csapp-discount-list .discount {
display: flex !important
}
.csapp-discount-list .discount_price .csapp_money {
background: #63c17d !important;
color: #fff;
}
.csapps-table td,
.csapps-volume-discount-tiers table thead tr:last-child td,
.csapps-volume-discount-tiers table thead tr:last-child th {
text-align: left
}


If your theme is not listed above don’t worry. Click here to request to configure the app with AJAX.