Support » Theme: Twenty Seventeen » Change menu bar colour

Viewing 13 replies - 1 through 13 (of 13 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Background colour?

    Thread Starter hansbeen

    (@hansbeen)

    Background yes, not the text.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Try:

    
    .navigation-top,
    .main-navigation ul {
        background: red;
        border-top: 0;
    }
    
    • This reply was modified 4 years, 2 months ago by Andrew Nevins.
    Thread Starter hansbeen

    (@hansbeen)

    nothing happens if I input it in extra CSS in the editor.
    Does that one come from another post? I already tried that one before 🙂

    • This reply was modified 4 years, 2 months ago by hansbeen.
    • This reply was modified 4 years, 2 months ago by hansbeen.
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Try this instead:

    
    html .colors-custom .main-navigation ul,
    html .colors-custom .navigation-top,
    .navigation-top,
    .main-navigation ul {
        background: red;
        border-top: 0;
    } 
    
    Thread Starter hansbeen

    (@hansbeen)

    that works, I put in lightgreen, is there a lighter green than glightgreen? How do these colours work?
    I found out the html-colours work also

    • This reply was modified 4 years, 2 months ago by hansbeen.
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    CSS can take a ‘hexadecimal’ value for the colour. Try using this tool to generate that value: http://htmlcolorcodes.com/

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    For example:

    
    background: #AEFFB5;
    

    Hexadecimal colours must start with a hash character.

    • This reply was modified 4 years, 2 months ago by Andrew Nevins.
    Thread Starter hansbeen

    (@hansbeen)

    that ones I know more or less, I was curious about the written colour, like red, green, en lightgreen

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    There is only a set vocabulary: http://www.w3schools.com/colors/colors_names.asp

    @anevins:

    For those (many) of us who aren’t WordPress experts, can you please indicate which file(s) you’re modifying?

    For example, in this thread you provide three coding examples, but how are we to know which file(s) you’re modifying if you don’t tell us?

    Thanks.

    Thread Starter hansbeen

    (@hansbeen)

    @1joel2u

    I am truly no expert either, just an experienced amateur 🙂
    All theses codes are css, which you can try out and remove very easily in the customizer > extra css.
    Just copy paste them, and remove or modify them. You can see the result immediately on the right, and if you don’t like the result just click on the X in the left top, then it saves nothing, and you can start anew by clicking “customizer”.
    If you like it, then click save.
    You can always change or remove it afterwards.

    If you do a lot of modifications you can also put them in (or transfer them to) the css file in the child theme.

    • This reply was modified 4 years, 2 months ago by hansbeen.
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    @1joel2u, The stock answer that I’ve littered all over the support forums is:
    If you’re not using a Child Theme, and if the theme doesn’t have a section for CSS modifications then do the following:

    1. Install this Custom CSS Manager plugin http://wordpress.org/plugins/custom-css-manager-plugin
    2. use its “CSS Code” section of the dashboard to hold your CSS modifications:
    3. (put CSS code in)
    4. Save

    Alternatively use your Child Theme style.css file to hold your CSS modifications

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Change menu bar colour’ is closed to new replies.