WordPress.org

Support

Support » Themes and Templates » Anthem Theme edit style.css

Anthem Theme edit style.css

  • Hello, I like to edit my css file for the anthem wordpress theme. Already changed some colours but can’t figure out how to change the colour of the main navigation under the round logo. Could somone please help me out? You will find the css code for the main nav and the links. Somebody knows how I can change the main navigation links and keep te reddish color on the other links in the posts?

    this is the website: http://minimaljournal.com

    /* MAIN NAV
    ----------------------------------------------- */
    nav {
      margin-bottom: 30px;
      padding: 1em 0 1.1em;
      border-top: 1px solid #ececec;
      border-bottom: 1px solid #ececec;
      -moz-box-shadow: 0 5px 8px -5px rgba(0, 0, 0, 0.075);
      -webkit-box-shadow: 0 5px 8px -5px rgba(0, 0, 0, 0.075);
      -o-box-shadow: 0 5px 8px -5px rgba(0, 0, 0, 0.075);
      box-shadow: 0 5px 8px -5px rgba(0, 0, 0, 0.075);
    }
    nav ul {
    	line-height: 1.5em;
    	font-size: 1.5em;
    }
    nav li a {
      font-weight: bold;
    }
    
    .sub-menu {
      font-size: 1em;
      line-height: 1.5em;
      margin-left: 1.5em;
    }
    
    /* LINKS
    ----------------------------------------------- */
    a {
      text-decoration: none;
      color: rgb(206, 79, 76);
      -moz-transition: all 0.2s ease-in-out;
      -webkit-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out;
      border-style: none;
    }
    
    a:hover, a:focus {
      color: rgba(0, 0, 0, 0.5);
    }
    
    a img {
      -moz-transition: all 0.2s ease-in-out;
      -webkit-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      transition: all 0.2s ease-in-out;
    }
    
    a:hover img, a:focus img {
      opacity: .85;
    }
    
    /* ALT LINKS IN POST + PAGE BODY */
    .post-body a,
    #content.page a,
    #comments a,
    #respond a {
      color: #000000;
      font-weight: bold;
    }
    .post-body a:hover,
    #content.page a:hover,
    #comments a:hover,
    #respond a:hover {
      color: rgba(20, 158, 231, 0.5);
    }
    
    a.post-edit-link {
      padding: 3px 6px;
      font-size: .75em;
      background: rgba(0, 0, 0, 0.05);
      -moz-border-radius: 3px;
      -webkit-border-radius: 3px;
      -o-border-radius: 3px;
      -ms-border-radius: 3px;
      -khtml-border-radius: 3px;
      border-radius: 3px;
      opacity: .75;
      color: #000000;
    }
    
    a:hover.post-edit-link {
      color: rgba(0, 0, 0, 0.6);
    }
Viewing 10 replies - 1 through 10 (of 10 total)
  • Moderator Andrew Nevins

    @anevins

    Have you created a Child Theme?

    I’m a noobie when it goes to themes and editing theme so I just installed it and wanted to change the colours a bit. Don’t even know what a cild theme is?

    Moderator Andrew Nevins

    @anevins

    A Child Theme a sub-folder consisting of modified files.

    Better explained here
    http://codex.wordpress.org/Child_Themes

    Just googled it. No I’m editing in the style.css of the parent theme. Is that why it’s not functioning? Or am I just adding a color: rgba(0, 0, 0, 0.95); in the wrong place?

    Moderator Andrew Nevins

    @anevins

    Unfortunately,
    Forum users aren’t allowed to advise editing of parent theme stylesheets.
    Until you use either a Child theme or a Custom Style plugin, we can’t help you.

    It should work regardless. A child theme is helpful because when you upgrade your theme, your changes won’t be reversed

    A Child Theme a sub-folder consisting of files that you want to modify.

    Better explained here
    http://codex.wordpress.org/Child_Themes

    —-
    Unfortunately,
    Forum users aren’t allowed to advise editing of parent theme stylesheets.
    Until you use either a Child theme or a Custom Style plugin, we can’t help you.

    Thx, I will use a child css. When I bought the Anthem theme it was prvided with it so I just uploaded it. But I still don’t know how to edit the colors of the Main Navigation and keep the colours of the links in the post the way they are.

    It should work regardless. A child theme is helpful because when you upgrade your theme, your changes won’t be reversed

    I understand, so I will use a child theme because the provider of Anthem theme updates it frequently so a child theme is indeed much better.

    But where do I change the colour of the man nav in my style.css in provided in my first post?

    Moderator Andrew Nevins

    @anevins

    To change the colour of the navigation, add in the Child Theme;

    header a {
     color: #000;
    }

    Change #000 to the actual hexadecimal value of your colour.

    Thx It worked out and have installed the child theme. So with future updates the colours won’t change!

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Anthem Theme edit style.css’ is closed to new replies.