Add a cart count on mobile view header - Focal theme

Store Design
, , ,

Topic summary

A user removed the cart count bubble from their Shopify Focal theme and needs help restoring it for mobile view.

Solution provided:

  • Locate header.liquid in the theme code editor
  • Add a <span> element with cart count inside the cart link <a> tag:
    <span class="cart-link__bubble cart-link__bubble--visible">{{ cart.item_count }}</span>
  • Insert corresponding CSS in base.css to style the bubble (width, height, color, font-size, positioning)

Additional refinement:
The user requested to hide the count when it equals zero. This was addressed by wrapping the span in a conditional statement:

{% if cart.item_count > 0 %}
  [span code here]
{% endif %}

The solution was marked as resolved by the original poster.

Summarized with AI on November 4. AI used: claude-sonnet-4-5-20250929.
1

I removed the cart count bubble long time ago in code, and now I cant find a way to bring it back. I would like to add the cart count number back to my site and show it inside the cart icon on mobile view. Can this be done by adding some code?

Here is a link to the site: https://568839.myshopify.com/

2

Hi @galleriste

You remove the count from the code to retrieve it you need to follow these steps:

  • Open Theme
  • select three dot → select code editor
  • find the header.liquid file
  • search this code

In the
Past that code

{{ cart.item_count }}

Then search for Base.css and past that css

.cart-link__bubble--visible {
    top: 9px !important;
    width: 15px !important;
    height: 15px!important;
    color: #fff;
    font-size: 9px;
    text-align: center;
}

I Hope This work

1 Like
3

Is it possible to hide the cart count if it is 0?

4

Yeah Sure you can do that by simply adding a If condition in that above code

Here is the modified code

{% if cart.item_count > 0 %}
  <span class="cart-link__bubble cart-link__bubble--visible">{{ cart.item_count }}</span>
{% endif %}

If This Solution worked Like This and Mark it as a Solution

1 Like