You will need a developer to make these changes.
Notes:
- If you've already hidden the Donation Tiers custom donation units in cart, your Round-up donation units will automatically be hidden in cart as well.
- We can customize the front-end, i.e., how it looks in cart or at checkout (only for Shopify Plus users). However, we are unable to make any customizations in the back-end, such as in your Orders section in your store.
1. Open your theme editor and look for the header.liquid file:
2. Search for a code block similar to
<span>{{ cart.item_count }}</span>
You might find more than one instance of this code and it might be within conditional (if/else) statements, for example:
{% if cart.item_count > 9 %}
<span class="count–double">{{ cart.item_count }}</span>
{% else %}
<span>{{ cart.item_count }}</span>
{% endif %}
2.1 Once you find that code, insert the following snippet to adjust the number of items in the cart.
{% assign cart_count = 0 %}
{% for item in cart.items %}
{% if item.vendor == ‘DailyKarma’ %}
{% assign cart_count = cart_count | plus: 1 %}
{% else %}
{% assign cart_count = cart_count | plus: item.quantity %}
{% endif %}
{% endfor %}
2.2 Then replace cart.item_count with cart_count. Usually, you’ll only want to do this in output, not in conditions. But if you find it affects your store’s styling, also change it there as well.
{% if cart.item_count > 9 %}
<span class="count–double">{{ cart_count }}</span>
{% else %}
<span>{{ cart_count }}</span>
{% endif %}
3. Next, look for cart.liquid. Usually it will just include cart-template.liquid. If this is the case, open it.
NOTE: If you have Shopify 2.0, the file will be main-cart-items.liquid and you will need to update the file cart-icon-bubble.liquid
3.1 Check for cart.item_count output (optional, may or may not be there), replace as before. Pay attention if cart page includes header.liquid. If it is, cart_count variable already exists.
For example, let’s say in a code file we want to replace item price with total price as we hide the count. In that case, we would look for this code snippet:
<span class="saso-cart-item-price" data-key="{{item.key}}">{{ item.price | money }}</span>
and replace it with:
{% if item.vendor == ‘DailyKarma’ %}
<span class="saso-cart-item-price" data-key="{{item.key}}">{{ item.final_line_price | money }}</span>
{% else %}
<span class="saso-cart-item-price" data-key="{{item.key}}">{{ item.price | money }}</span>
{%endif%}
And to hide the quantity box, you'll want to find a code snippet like this one:
<div class="cart__qty">
<label for="updates_{{ item.key }}" class="cart__qty-label">{{ ‘cart.label.quantity’ | t }}</label>
<input class="cart__qty-input" type="number" name="updates[]" id="updates_{{ item.key }}" value="{{
item.quantity }}" min="0" pattern="[0-9]*">
</div>
and replace it with:
<div class="cart__qty">
{% if item.vendor != ‘DailyKarma’ %}
<label for="updates_{{ item.key }}" class="cart__qty-label">{{ ‘cart.label.quantity’ | t }}</label>
<input class="cart__qty-input" type="number" name="updates[]" id="updates_{{ item.key }}" value="{{
item.quantity }}" min="0" pattern="[0-9]*">
{% endif %}
</div>
For example:
3.2 Hit SAVE and then CONNECT Round-Up. Then, view your cart with round-up and you’ll see the Round-Up quantity box is gone.
4. To hide the Round-Up price increments, find a code snippet like this one:
<div data-cart-item-price>
<div {data-cart-item-regular-price-group>
<dt><span class="visually-hidden">{{ ‘products.product.regular_price’ | t }}</span></dt>
</div>
</div>
and replace it with:
<div data-cart-item-price>
{% if item.product.type != ’roundup-donation’ %}
<div {data-cart-item-regular-price-group>
<dt><span class="visually-hidden">{{ ‘products.product.regular_price’ | t }}</span></dt>
</div>
{% endif %}
</div>
For example:
Here is what the cart looks like with Round-Up enabled and both the price increments and the quantity box gone:
Hit SAVE and then CONNECT to go live.
If you don’t see your round-up widget appear, contact support@dailykarma.com and we will assist you within 72 hours