How to change Header icons to display text

Store Design
, ,
1

Hello everyone,

So I’m trying to change my header icons to show text instead of icons.

Can anyone help me figure it out?

Thanks

cy.png
cy.png1920×847 42.7 KB

www.studioblank.store

2

@StudioBlank - please add this css to the very end of your base.css file and check,
Shopify Admin → Online Store ->Theme → Edit code → base.css

.header__icon--account span{position: relative !important; overflow: visible;}
.header__icon--account account-icon{display: none;}

.header__icon--cart .svg-wrapper{display: none;}
.header__icon--cart span.visually-hidden{position: relative !important; overflow: visible;}

.header__icon--search{content: "search";}
.header__icon--search span{display: none;}
.header__icon--search{display: flex; align-items: center;}
3

How do I prevent this from happening when I log out? I want it to be in one line.

srg.PNG
srg.PNG1920×926 58.6 KB

4

@StudioBlank can you please add the given code? so it appears like that and I can check

5

Okay done.

6

@StudioBlank – for search , add this line and check

.header__icon--search:after{content: "search";}
7

This code doesn’t work but I don’t need it anymore. I just want to fix the Login text and have some space between Login and Cart, like a margin of 1rem

8

@StudioBlank add this and check

.header__icon--account{height: 6.4rem !important; width: 6.4rem !important;}
.header__icon--account span{width: 100%;}
9

Yessir now it works. Thanks