How to change the cart icon size on the mobile version?

PackedUSA
New Member
8 0 0

Hey all!

I changed the cart icon I had on my website because the bag icon did not fit. Since changing it to an actual cart logo on the mobile version of my website the cart icon became miniature. Its barely visible and I do not want it to confuse my customers. Attached is pictures as well as my website information.

Your help is much appreciated!

www.packedusa.com

Password: PackedUSA

Screen Shot 2021-11-11 at 12.24.54 PM.png

Replies 2 (2)
PaulNewton
Shopify Partner
3503 234 688

The SVG was proportional to the websites font-sizes, so that whole area isn't mean for block content like an image.

And you may need to account for cart-count icon as well.

Really the best course is to get the cart icon as a SVG setup the same way as the previous icon.

And the image you are using does not have a transparent background.

 

A quick fix is to put a fixed width on the image in the theme styles

Always backups themes and files before making changes.

a.site-header__icon img {
    width: 44px;
}

 

If you need this customization contact me at paull.newton+shopifyforums@gmail.com with this topic, use-case details,store & theme names.

What important thing did you learn this Black Friday?


Answers powered by coffee Buy Paul a ☕ Coffee for more answers or donate to eff.org

Problem Solved? ✔Accept and Like solutions to help future merchants

Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
PackedUSA
New Member
8 0 0

I changed the image file so an SVG file. Now the background became transparent but the icon is still miniature on the mobile version.