Code for Navigation Link Titles

  • Greetings WordPress users. I am currently creating a navigation menu for my website and I am looking to change the color of my navigation titles so they don’t blend in the background – since currently, my background and title colors are the same – and I am trying to locate the code in order to change the title color. However, I am not having any luck finding the specific area in the css editor where I can change title color, link color, etc.

    I am using the WPZOOM theme. When you visit the website, just scoll across the white area above the header image and you will notice the links. Any help is greatly appreciated.

    Here is my website – https://www.thesiegesound.com

Viewing 7 replies - 1 through 7 (of 7 total)

  • Hey thesiegesound,

    The code you are looking for is in your style.css file, this is where you add the background color.

    On line 62 of your style.css file add a line of code like this:
    background: #999;

    The final code should will look like this :

    nav ul, nav ol, #mainmenu, .part-items {
list-style: none;
list-style-image: none;
margin: 0;
padding: 0;
background: #999; }

    Let me know if this helps! Good luck!

    Thread Starter thesiegesound

    (@thesiegesound)

    the code for the meeta theme is just a little different than the code you posted. Here are the sections that I edited, but nothing seems to work:

    #navbar {
    float: left;
    margin: 5px 16px 5px 30px;
    color:#fff;
    }

    #navbarsecond {
    background: #fff;
    }

    #secondnav {
    background: #fff;
    line-height: 25px;
    padding: 12px 30px 3px;
    }

    #secondnav span {
    color: #827f7f;
    font-size: 12px;
    float: right;
    }

    #secondnav ul {
    list-style: none;
    }

    #secondnav li {
    float: right;
    font-size: 10px;
    background: #fff;
    color: #BCBCBC;
    display: block;
    height: 21px;
    padding: 3px 13px 0;
    margin: 0 7px 10px;
    border-radius: 10px;
    line-height:1.5;
    }

    #secondnav li a {
    font-size:16px;
    color:#758ea9;

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Careful, any changes to the theme’s original files will erase once the theme updates.

    It’s best to use either a Child Theme or Custom Style/CSS plugin when modifying themes.

    Hey there,

    Editing those lines of CSS will not change the background color of your navigation menu. It appears that the lines of code you changed are lower on the style.css file than the line I suggested.

    First, try to scroll up and look higher in the CSS code for :
    “nav ul, nav ol, #mainmenu, .part-items”
    it’s listed under:
    /* Reset & General Styling */

    If you still cannot find that line of code, simply write an entirely new line of code in your CSS file that looks like this:
    #mainmenu { background: #999; }

    In either case, #mainmenu is the target ID that you need to update in order to change the background color.

    if its the link color you want to change just edit this

    .dropdown a {
    color: #fff;
    display: block;
    font-size: 13px;
    line-height: 1.5;
    margin: 0 5px 0 0;
    padding: 8px 10px;
    text-decoration: none;
}

    to this

    .dropdown a {
    color: #000000;
    display: block;
    font-size: 13px;
    line-height: 1.5;
    margin: 0 5px 0 0;
    padding: 8px 10px;
    text-decoration: none;
}

    Thread Starter thesiegesound

    (@thesiegesound)

    Ah…. Thanks J! That did the trick.

    No problemo, glad it helped

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Code for Navigation Link Titles’ is closed to new replies.