Total cart amount line

[Sao23]

Hi, I wanna code fix under the cart ion an line with { total cart amount } ..I ve coded it somehow but it s doesnt calculating when you add to cart… Please help me achieve this.. my website: www.aiciavem.ro

[vittoriaartuso]

Hi there! I'd be happy to help you fix the cart total issue on your website. Can you please share the code snippet you've tried so far? Additionally, what platform or ecommerce system is your website built on (e.g. Shopify, WooCommerce  , custom)? This will help me better understand and provide a more accurate solution.

[swym]

Hey @Sao23, 

Thanks for sharing your store URL! I went ahead and added some products to the cart, and everything seems to be working perfectly. The cart total updated as expected when I added or removed products, or when I adjusted the quantities. You can check the screenshot I’ve added below for reference:

If I’ve missed anything or if there’s something else you’re trying to address, please feel free to let me know. Otherwise, rest assured that your store’s cart journey is working smoothly, and everything seems to be functioning as expected for your customers.

If my response helped you, please consider giving it a like (👍) and marking it as an accepted solution if it resolved your issue. Your feedback helps other community members with similar questions. 

Thank you!

Regards, 

Abhishek from Swym

[Sao23]

Hi Mr. Swym , sorry if my english wasnt or is not the best. I don t have any problem with the cart, all is working perfectly.. I just wanna add on mobile view an “ total amount in cart “ line under the cart icon.. All is working perfectly ,it s just an upgrade that I want

[swym]

Hi @Sao23, 

Thanks for confirming that everything works as expected and letting me know what you're looking for.

Now, to add a line that shows the total price of the cart, you can follow these steps:

1. Open the code editor, as shown in the screenshot below.

2. Create a snippet called ‘custom-cart-total’ and add the below code based on your needs. Don’t forget to include your custom CSS within the style tag, as shown in the code, to ensure the total price is displayed in the layout you desire on your store.   

a. If you would like to display the price without currency, use this code: 

<span id="custom-cart-total-price">Total amount in cart: <span class="price">{{ cart.total_price | money }}</span></span>

{% comment %} 
  Add the desired styling for the price component inside the style tag 
{% endcomment %}

<style>
#custom-cart-total-price { display: none }

@media only screen and (max-width: 767px){
  #custom-cart-total-price { display: block }
}

// Add your custom CSS here. 
</style>​

 b. If you would like to display the price with currency, use this code: 

<span id="custom-cart-total-price">Total amount in cart: <span class="price">{{ cart.total_price | money_with_currency }}</span></span>

{% comment %} 
  Add the desired styling for the price component inside the style tag 
{% endcomment %}

<style>
#custom-cart-total-price { display: none }

@media only screen and (max-width: 767px){
  #custom-cart-total-price { display: block }
}

// Add your custom CSS here. 
</style>​

3. To display the total price on mobile devices, you can use the code below. Simply add it wherever you want the total price to appear on your store:

{% render 'custom-cart-total' %}

4. Done? Now save the file, and try previewing to confirm if the changes work for you. 

I hope this will help you in getting the desired layout. 

If my responses helped you, please consider giving them a like (👍) and marking them as accepted solutions if they resolved your issue. Your feedback helps other community members with similar questions.

Thank you!

Regards,
Abhishek from Swym 

[Sao23]

Thanks a lot! I ll try in some short time,thanks!

[Sao23]

 

Hi back Swym, sorry for late answer. I have 2 problems, one from styling, please help me put the widget fix under the cart icon, and with a lot more smaller text, and the secound one( probably js) , when you add something to cart, until you refresh the page it will still show you total: 00 ron

[swym]

Hi @Sao23, 

I can help you with the CSS. I checked your live theme and looks like you did not add this feature yet there and are working on a duplicate theme. Please share with me the preview link for your theme on which you have added this total price component and I will help you in improving the styling. 

To update the cart price dynamically when products are added or removed, you'll need to modify the JavaScript code to reflect the correct price every time the cart is updated. Since every theme has its own set of files and a unique structure, I can't provide the exact code or suggest the right location to add it, especially in your case, where products can be added from multiple sections like the homepage, product pages, and collection pages.

If you're not familiar with implementing this, I can suggest the steps to you, but it might not be helpful if you don't have enough knowledge about Javascript. The best course of action would be to hire a Shopify developer who can assist you in properly implementing this solution for your store.

Thank you!

Regards,
Abhishek from Swym 

[Sao23]

Thanks a lot Swym!