How to show compare price on shopping cart total

nijntjelover · ‎02-01-2024

Hi,

2 questions:

-If you add something to my cart, the prices are twice visible, under the product title and then right of it again. I just want it to show compare price and new price on the right side.

-second question, how do I make the old total and new total visible on the cart page. I want customers to see what they were originally paying.

bundoshop.nl

MastersHub · ‎02-02-2024

In the first question, did you mean like in the image?

Helpful ? Like and Accept Solution
Buy me a Coffee
Need a Shopify Developer?
Send Email or Chat on WhatsApp

nijntjelover · ‎02-02-2024

yes this looks good, but I also want the "Totaal" to show compare price! tnx!

MastersHub · ‎02-02-2024

I understand. The first request is easy. I will provide you with the code and instructions for it. If it doesn't perform well, we may need to make changes in the theme code.

For your second request, changes are needed in the theme code. Hire a developer for this. If have any questions let me know so I can clarify, and if not, and you'd like to work together please feel free to message me directly

Please add this code to your theme.liquid file, after <head> element in Online Store > Themes > Edit code

<script>
    document.querySelector('.price.price--end').innerHTML = document.querySelector('.price-compare').parentElement.innerHTML;
    document.querySelector('.price-compare').parentElement.innerHTML = "";
</script>

Helpful ? Like and Accept Solution
Buy me a Coffee
Need a Shopify Developer?
Send Email or Chat on WhatsApp

nijntjelover · ‎02-02-2024

Did not work sir

MastersHub · ‎02-02-2024

I'm sorry. We can't make price changes with Javascript; Shopify prevents this. I just learned about it. We need to make changes in your theme code. If have any questions let me know so I can clarify, and if not, and you'd like to work together please feel free to message me directly.

Helpful ? Like and Accept Solution
Buy me a Coffee
Need a Shopify Developer?
Send Email or Chat on WhatsApp

Vinsinfo · ‎02-02-2024

Please follow below instructions to achieve this. Please feel free to contact us if you have any queries.

1. Go to "Online Store" -> "Themes".

2. Select Edit code.

3. Go to "main-cart-items.liquid" file. Find price-compare and remove the section starting from product-option.
4. Find "cart-item__totals right small-hide" section and "cart-item__totals right medium-hide large-up-hide" and paste below code like in the attached images.

{% if item.product.compare_at_price > 0 %}

<span style="text-decoration:line-through;">{{ item.product.compare_at_price | times: item.quantity | money }}</span>

{% endif %}

5. Go to "main-cart-footer.liquid" and paste the below code before the line "<div class="totals">" as like in the attached image.

{% assign actual-total = 0 %}

{%- for item in cart.items -%}

{% if item.product.compare_at_price > 0 %}

{% assign total_compare_price = item.product.compare_at_price | times: item.quantity %}

{% assign actual-total = actual-total | plus: total_compare_price %}

{% else %}

{% assign actual-total = actual-total | plus:item.original_line_price %}

{% endif %}

{% endfor %}

{% if actual-total != cart.total_price %}

<p class="totals__total-value" style="text-decoration: line-through;">{{ actual-total | money }}</p>

</div>

{% endif %}

Please reach out to bizdev@vinsinfo.com for any enquires related to Shopify.
Our Services: Custom Theme Development, Theme Customization, Custom Feature Implementation, Data Migration, Custom APP Development, Website Optimization and Google Merchant Center Support

vortifytech1 · ‎08-26-2024

This Is Working Code

{% assign actual_total = 0 %}
{%- for item in cart.items -%}
{% if item.product.compare_at_price > 0 %}
{% assign total_compare_price = item.product.compare_at_price | times: item.quantity %}
{% assign actual_total = actual_total | plus: total_compare_price %}
{% else %}
{% assign actual_total = actual_total | plus: item.line_price %}
{% endif %}
{% endfor %}

{% if actual_total != cart.total_price %}
<div class="totals total_savings_amount" role="status">
<h2 class="totals__total">Total Savings</h2>
<p class="totals__total-value total_savings">{{ actual_total | money_with_currency }}</p>
</div>
{% endif %}

How to show compare price on shopping cart total

How to show compare price on shopping cart total

Community Blog Articles