Change header of the Minimalista theme

Store Design
, ,

Topic summary

Changing the Minimalista theme header from white to black, with icons/menu in white. The site is maisonnoblesse.nl.

Proposed approach:

  • Edit Shopify’s theme.liquid (Online Store → Theme → Edit code).
  • Add custom CSS either before or above to set a black header and white icons/menu.

Current outcome:

  • The header color updates to black as intended on some views.
  • Issues persist: clicking the header makes it turn white temporarily; the product page header stays white by default; a 1px gap appears at the top when scrolling upwards on the homepage.

Latest update:

  • Additional CSS was suggested to address the click/active state, product page styling, and the scroll gap.
  • No confirmed resolution yet; the thread remains open.

Notes:

  • theme.liquid is the main Shopify layout file; CSS controls visual styles across pages and states (default, hover/active, sticky).
  • Screenshots were shared to illustrate code placement and the visual result, which are central to understanding the suggested changes.
Summarized with AI on December 20. AI used: gpt-5.
1

I am using the Minimalista theme on my website and I have an issue with the header color. The background of the header is currently white, and I want to change it to black. Additionally, the icons and menu buttons need to be changed to white. Can someone help me with this? The website in question is “maisonnoblesse.nl”.

1 Like
2

Hey @Wrangori

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1725538596424.png
Moeed_0-1725538596424.png1878×856 231 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

1 Like
3

Hi @Wrangori ,

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before

topnewyork_0-1725538858521.png

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!

1 Like
4

Thank you for your quick response. I’ve made the adjustments, and the color has indeed changed. Thank you very much! However, when I click on it, the header still turns white. Also, on the product page, it remains white by default. Is there a solution for this? Additionally, on the homepage, when I scroll from bottom to top, there’s a 1px gap where the header isn’t covered. Thanks in advance.

5

Thank you for the quick response! I’ve applied the changes, and the color has successfully updated. I really appreciate your help. However, I’m still facing a couple of issues. When I click on the header, it temporarily turns white again, and on the product page, the header remains white by default. Is there a fix for this? Additionally, on the homepage, when I scroll from bottom to top, there’s a 1px gap where the header isn’t fully covered. Any suggestions would be greatly appreciated. Thanks in advance!

6

Hi @Wrangori ,

Try the below code:

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!