Need help with basic css color customization

  • Unknown's avatar

    Hi there!
    I am trying to create a custom color palette for the Purpose theme and I do not know CSS, but chat support suggested that I post in this forum and somebody might be able to assist. I would like the following colors:

    Header: white #ffffff
    Background: #2c669b
    Text: white #ffffff
    Header Links: 1b3e8c
    All Other Links: 9eb2db

    This theme doesn’t allow me to choose these colors in the customizer, so I need custom code to override that. If anybody can help me out I would really appreciate it!

    The blog I need help with is: (visible only to logged in users)

  • Hi, I took my best shot at this given the details above. I’m not 100% certain each snippet will match up to the things you were hoping to customize.

    For the header to have a white background, this will work:
    div#header.header-large {background-color: #fff;}

    For the header links to be that color (1b3e8c), this will work:
    #wrap #header .menu a, #wrap #header .menu a:link {color: #1b3e8c;}

    For all other links to be that color (9eb2db), this will work:
    .page a, .page a:link {color:#9eb2db;}

    And for the background to be that color (2c669b), this will work:
    body.custom-background {color:#2c669b;}

    The rest of the text is currently showing as white for me, so looks like that part is done.

  • Unknown's avatar

    Thank you so much! All of that seems to work perfectly, except the links in my header/top menu are still showing up as black. This isn’t a huge problem but is there any other fix for that?

    Also, is there a way to change the grey text in the footer (i.e. the phone number in the Contact widget and small text in the Text widget) to be white as well?

  • The topic ‘Need help with basic css color customization’ is closed to new replies.