I want a different colour for the menu and the rest of the site

albestudios · ‎08-27-2024

Hello,
I'm in the process of creating a website for my clothing brand and I'd really like to have my logo and my text welcome menu in white and then on the other pages of my site in black. ( i have the dawn theme )

I can't do it, if anyone has a solution please let me know.

Here is the link to my site ( in construction) :

https://albesutdios.myshopify.com/

thank you

Dan-From-Ryviu · ‎08-27-2024

Please add this code to theme.liquid file, after <head> in Online Store > Themes > Edit code

{% if template == 'index' %}
<style>
.header__icon .icon,
.header__menu-item { color: #fff !important; }
.header__heading-logo { filter: invert(1); }
</style>
{% endif %}

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Amazon Products Importer - Import Amazon Products to Dropship in Your Store!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

View solution in original post

Dan-From-Ryviu · ‎08-27-2024

Please add this code to theme.liquid file, after <head> in Online Store > Themes > Edit code

{% if template == 'index' %}
<style>
.header__icon .icon,
.header__menu-item { color: #fff !important; }
.header__heading-logo { filter: invert(1); }
</style>
{% endif %}

- Helpful? Like & Accept solution!
- Ryviu - Product Reviews & QA app: Import reviews from AliExpress, Amazon, Etsy, Walmart, Dhgate and CSV.
- Amazon Products Importer - Import Amazon Products to Dropship in Your Store!
- Lookfy Gallery: Lookbook Image - Gain customers with photo gallery, video & shoppable image
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- En...Sign up now.

BSSCommerce-HDL · ‎08-27-2024

Hi @albestudios,

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag:

{% if template.name == 'index' %}
    <style>
    sticky-header.header-wrapper {
       background-color: white !important;
    }
    sticky-header.header-wrapper .header__menu-item span {
       color: black !important;
    }
    </style>
{% endif %}

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

Sale banner, pop ups: Customize your sale banner, pop-ups and create countdown bar to boost conversion rate.
Simicart: Transform your Shopify store into a stunning and fully functional mobile app with just a few simple steps.
Product Labels & Badges: Get more sales with striking labels, badges, and banners from our 10,000+ available templates.

BSS Commerce - Full-service eCommerce Agency | Use Shopify for 1$ in the first month now

albestudios · ‎08-27-2024

Hi thank you for your help,

but at the end it only change the background in white not the texte.

but someone give me a code who worked.

Thank you so much ❤️

I want a different colour for the menu and the rest of the site

I want a different colour for the menu and the rest of the site

Community Blog Articles