To continue receiving payouts, you need to secure your account by turning on two-step authentication. If two-step authentication is not turned on your payouts will be paused. Learn more

Replace cart, account and search icons

Pam9
Explorer
103 0 15

Hey, I would like to replace my  current icons with some others that I already have uploaded in assets.

Also, I want to be able to modify the color and size of those. ( I tried to replace them but couldn't change the color)

Lastly,  I would like the search icon to be first, then the cart and lastly the account icon. (From left to right).

 

cart-icon.png

search-icon.png

account-icon.png

 

 My website: https://www.bafaluc.com

Reply 1 (1)
PaulNewton
Shopify Partner
4876 409 1049

@Pam9 All together this is an advanced customization.

 

The Brooklynn theme uses web-fonts as icons

You would either need to modify the icons font files in the theme assets.

Or modify the theme to use image based icons, such as through the timber.scss file changing .icon-customer:before to be CSS image backgrounds using images from the assets folder.

 

To change the order of the icons requires  the source order itself in the code often in header.liquid or nav.liquid etc. Technically can be done with only CSS but that's a kludge since the icons are not in their own container apart from the rest of the navigation.

 

With image based icons to be able change the colors through CSS they need to be transparent masks to let a background color show through, or you have to use CSS filters to fake it.

Otherwise just change the color in the image itself.

 

 

Merchants that need customizations like this can contact me at paull.newton+shopifyforums@gmail.com with topic url, store url, theme name, and details.

Finally Combinable Discounts - EARLY ACCESS ONLY - Use Free Shipping With Other Discounts

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