How do I change the colour of just the menu and body text on my store?

Hello,

I would like the change the body text and menu text colours on my Shopify store so they are black. Currently my theme settings only allow me to set one text colour which is applied to all the text in my store. However to be in keeping with my brand, I’d like the headers to stay blue, but change the menu and body text to be black. Please could someone advise how to do this?

Thanks,

Naomi

1 Like

Hey Naomijenkin,

You’d need to do some custom coding in order to achieve that, if the color settings aren’t built-in to your current theme. I wouldn’t really be able to provide any further insight than that, without having a link to your store (so that I can look at the coding).

If you wanted to hire someone to do the coding for you, then I’d recommend HeyCarson or else someone from this page: https://www.shopify.com/partners/directory/services/store-setup/customize-theme

The coding costs would be about half the price of just buying a premium theme though, so I’m not sure if it’s really worth it.

If you’re willing to change themes (purchase a premium one), then most premium themes have built-in controls to do exactly what you’re wanting. You can add the ‘demos’ of themes to your store (before you commit to buying them) so that you can see which color options are built in.

Cheers,

Stephen

Hi @naomijenkin

Would you mind to share your Store URL website? with password if its unpublish. And please let us know which body text you like to change the color. Thanks!

Hi Stephen,

Thanks for your reply. My store is https://shop.naomijenkinart.com/

Best wishes,

Naomi

Sure - my store is https://shop.naomijenkinart.com/

Basically all the body text which is currently blue, and the nav menu I’d like to change to black. I want to keep all the headings as they are.

Thank you!

1 Like

Thanks for the info, do you mean all the home page you like to color black? Like this?

This is the code.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
.header__menu-item {
    color: black !important;
}
main#MainContent * {
    color: black;
}
  • And Save.

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

Almost, except the headings (e.g. “Original Wildlife Art and Prints”) I wanted to retain their blue text colour which the theme is currently set to.