Shopify themes, liquid, logos, and UX
I didn't want to change the color on the heading and link as it connects and changes my heading color for my products. Is there any way to manually change the colour for both the hamburger icon and search icon in the header?
It's currently blacked out like this and I want the 2 icons to be white..
Hey @KyanneJewels,
Please add the following code at the end of your assets/theme.scss.liquid file
.btn--link {
color: aqua !important;
}
You can change color as per your need. Hope this works for you.
Thanks!
Hello @dmwwebartisan @KyanneJewels
Please, could you confirm if this has worked or not? I am currently trying to achieve the same - to convert Search, Basket and hamburger icon into White.
Please share your store URL
Thanks!
Please share store password becouse your store is password Protected.
Thanks!
ashnrd
please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.
.site-header .icon {fill: #fff !important;}
Thanks!
Please check screenshot
Brilliant, that's worked. Thank You!!!!!
Please add following css for desktop
.site-nav a:not([disabled]):hover, .site-nav a:focus {
color: #3a3a3a !important;
}
Hey @dmwwebartisan It worked on three texts but it hasn't on the first Shop text.
Please add css for "shop" text.
.site-nav__link:focus .site-nav__label, .site-nav__link:not([disabled]):hover .site-nav__label {
color: #3a3a3a !important;
}
Super, That's worked!
For the mobile, is it possible to do the underline on each text of the menu with no changing colours when hovering+clicking?
Hey @dmwwebartisan I'm having the same problem with all the icons on the right hand side on both desktop and mobile when I hover + click it still changes colour. Could you help me please?
Please share your store URL.
ashnrd
I can see your menu, search icon and cart icons are not clearly visible. Do you want to change the color of those things in the header?
If yes then which color you prefer?
I would like to leave it in the same colour as it is, would you able to tell me the code of the colour it is using right now?
I'd just like it to stop changing colour when it hover+clicks.
This is the color code : #3a3a3a
Hey @dmwwebartisan awesome, thanks! @Kinjaldavra that code didn't work 😞 please help
hello @RSS
please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.
.site-header__icons-wrapper .icon.icon-search:hover , .site-header__icons-wrapper .icon.icon-search:focus{
color: #b1b686 !important;
}
.btn--link.site-header__icon.site-header__menu.js-mobile-nav-toggle.mobile-nav--open:hover , .btn--link.site-header__icon.site-header__menu.js-mobile-nav-toggle.mobile-nav--open:focus{
color: #b1b686 !important;
}
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024