Solved

shopping cart not displaying items counts on mobile device but displays perfectly on desktop

radekusfamily
Tourist
14 1 4

Hello I have used simple theme to build www.radekus.com

On desktop the shopping cart icon works well. It displays number of product added to card. However on mobile devices it does not show number of products added to the cart. What could be wrong. 

Accepted Solutions (2)
radekusfamily
Tourist
14 1 4

This is an accepted solution.

Thanks Kyle is works nicely now. I did not know that the solution was so easy. 

View solution in original post

shamraiz
Visitor
1 1 0

This is an accepted solution.

hey Kyle - I have the same problem. The only difference is I don't have "small--hide" in the place you have suggested. "small--hide" shows up in several places though in theme.liquid but it's not appearing where you advised. Can you please help.

shamraiz_0-1641366562767.png

Thanks,

Sham

 

View solution in original post

Replies 10 (10)

FreshNarrative
Shopify Partner
133 19 27

Hi Radekusfamily,

The shopping cart icon has the class 'small--hide' on the span that includes the cart count. In your theme code find 'header.liquid' and remove "small--hide' from the <span> that holds the cart. You could do a search for {{ cart.item_count }} to find it. 

Let me know if you need help finding it.

Thanks,

Kyle Kopelke

Let's get Shopify figured out together. Get live USA-based customer service for your current or upcoming web project.
Email: hello@freshnarrative.io
Cocoa Beach, Florida

Monday - Friday | 9 AM — 5 PM EST
radekusfamily
Tourist
14 1 4

Thank you Kyle. 

I found this code in my header.liquid as per your suggestions. How do I remove "small--hide". what code should replace <span class ="small-hide"> if I have to remove "small-hide"

<div class="grid__item {% if shop.customer_accounts_enabled %} medium-up--two-fifths {% else %} medium-up--four-fifths {% endif %} small--one-half text-right">
<a href="{{ routes.cart_url }}" class="site-header__cart">
{% include 'icon-cart' %}
<span class="small--hide">
{{ 'layout.cart.title' | t }}
(<span id="CartCount">{{ cart.item_count }}</span>)
</span>
</a>
</div>

 

 

 

FreshNarrative
Shopify Partner
133 19 27

Hi Radekusfamily,

Simply remove "small--hide" completely. Nothing needs to replace it. Let me know how that works. 

Thank you,

Kyle

Let's get Shopify figured out together. Get live USA-based customer service for your current or upcoming web project.
Email: hello@freshnarrative.io
Cocoa Beach, Florida

Monday - Friday | 9 AM — 5 PM EST
radekusfamily
Tourist
14 1 4

This is an accepted solution.

Thanks Kyle is works nicely now. I did not know that the solution was so easy. 

Pawan2794
Tourist
9 0 1

</nav>
<div class="grid__item large--hide one-quarter">
<div class="site-nav--mobile text-right">
<a href="{{ routes.cart_url }}" class="site-nav__link cart-link js-drawer-open-button-right" aria-controls="CartDrawer">
<span class="icon-fallback-text">
<span class="icon icon-cart" aria-hidden="true"></span>
<span class="fallback-text">{{ 'layout.cart.title' | t }}</span>
</span>
<span class="cart-link__bubble{% if cart.item_count > 0 %} cart-link__bubble--visible{% endif %}"></span>
</a>
</div>  


please help, my code is a lil different from above. how to correct it.

shamraiz
Visitor
1 1 0

This is an accepted solution.

hey Kyle - I have the same problem. The only difference is I don't have "small--hide" in the place you have suggested. "small--hide" shows up in several places though in theme.liquid but it's not appearing where you advised. Can you please help.

shamraiz_0-1641366562767.png

Thanks,

Sham

 

Drops
Tourist
6 0 1

Hello,

 

I am experiencing the same as @shamraiz , "small--hide" also only appears in other spans but not where you advised - my code looks the same as @Pawan2794 

 

Can you help @FreshNarrative ?

 

Thanks!

Oliver

FreshNarrative
Shopify Partner
133 19 27

Can you share your shopify store URL or theme and I can take a look?

 

-Kyle

Let's get Shopify figured out together. Get live USA-based customer service for your current or upcoming web project.
Email: hello@freshnarrative.io
Cocoa Beach, Florida

Monday - Friday | 9 AM — 5 PM EST
Drops
Tourist
6 0 1
Drops
Tourist
6 0 1

Hello Kyle, could you already look into it? I would appreciate your help!

 

best, O.