13 {{ upvoteCount | shortNum }}
13 {{ upvoteCount | shortNum }}

Wordpress , Where is the CSS rule that defines the color of post title

by ronc0011
11 replies
  • WEB DESIGN
    • |
I am working on an Amazon site my blog consist of reviews of various products For this installation I am using an embedded font I have added the font to the beginning of the style.css files and I have found the .post h2 entry in the style.css file and declared my embedded font i.e 'DestroyRegular' and the page is in fact picking up the font and the font-size but I have not been able to find where the color is defined and even applying a color attribute here doesn't work does anyone know where this is defined I haven't been able to find anything that looks like it could be it. I have been able to get other occurrences of the h2 tag to pick up the font and color see here
BTWI am using the Socrates theme and Wordpress is on 3.4.2
#color #css #defines #post #rule #title #wordpress
  • Profile picture of the author mgreener
    Hi,

    It may be that the .post color is defining color for that specific h2 as well? It's hard to know without seeing the site.
    Signature
    2 Free Pro List Building Templates - Turbocharge Your Opt Ins
    {{ DiscussionBoard.errors[7084626].message }}
    • Profile picture of the author ronc0011
      Originally Posted by mgreener View Post

      Hi,

      It may be that the .post color is defining color for that specific h2 as well? It's hard to know without seeing the site.
      The site is The Preppers Forum


      In fact it was the link in my original post
      {{ DiscussionBoard.errors[7084742].message }}
  • Profile picture of the author dragonsouls96
    To change the color of the font using CSS can be accomplished by just setting the color of the id, tag, or class you are using. For example if you want to change the color of your h2 elements you could do this
    h2{
    color:blue;
    }
    If there is code somewhere else preventing this from working then I would suguest using inline css. Here is an example: <h2 style="color:blue;">
    When you use inline css it trumps any other css used anywhere else.
    I hope this helps you if you still have questions just ask me and I will do what I can to help.
    {{ DiscussionBoard.errors[7084641].message }}
    • Profile picture of the author ronc0011
      Originally Posted by dragonsouls96 View Post

      To change the color of the font using CSS can be accomplished by just setting the color of the id, tag, or class you are using. For example if you want to change the color of your h2 elements you could do this
      h2{
      color:blue;
      }
      If there is code somewhere else preventing this from working then I would suguest using inline css. Here is an example: <h2 style="color:blue;">
      When you use inline css it trumps any other css used anywhere else.
      I hope this helps you if you still have questions just ask me and I will do what I can to help.

      Yes actually I made those changes to .post h2 in fact I even made a change to .post a ie
      Code:
      .posth2
{
margin: 5px0100;
font-size: 16pt;
font-family: DestroyRegular;
color:#624f27;
} 
　
/* also declared a COLOR ATTRABUTE TO .post a */
　
.posta {
color: #624f27
}
      I have even tried adding a color attribute to the heading declarations at the beginning of the style.css file i.e
      Code:
      h2 {
font-size: 16pt;
color:#624f27;
}
      The inline idea would be an option if I knew where the post title was defined at I'm guessing it is a bit of PHP somewhere that calls something with a name like posttitle or something of the sort If I knew that I could probably find where to apply an inline style.
      {{ DiscussionBoard.errors[7084919].message }}
  • Profile picture of the author Istvan Horvath
    Aren't post titles' h2 having the "entry-title" class? Plus, they are in between anchor tags... which means you should have some rules for
    .entry-title a {...}
    Signature

    {{ DiscussionBoard.errors[7085458].message }}
  • Profile picture of the author rajeevrla
    Change the code in your style.css file, line 509 to this:
    Code:
    .post h2 {
    color: #624F27 !important;
    font-family: DestroyRegular;
    font-size: 16pt;


}
    Signature

    Have a great day!

    {{ DiscussionBoard.errors[7086147].message }}
    • Profile picture of the author webpeon
      Originally Posted by rajeevrla View Post

      Change the code in your style.css file, line 509 to this:
      Code:
      .post h2 {
    color: #624F27 !important;
    font-family: DestroyRegular;
    font-size: 16pt;


}

      Strange, that page itself actually has a css style block in the head section over-writing anything you do inside the css for a large number of tags.. you may want to check the header.php file and see if its in there.


      alternatively the above from the previous poster should work but don't ya just hate having to use !important when fixing stuff.. wordpress is the only platform I have ever had to use !important on - go figure
      Signature
      Web 2 Mobile
      The Future of The Web
      {{ DiscussionBoard.errors[7086477].message }}
    • Profile picture of the author ronc0011
      Originally Posted by rajeevrla View Post

      Change the code in your style.css file, line 509 to this:
      Code:
      .post h2 {
    color: #624F27 !important;
    font-family: DestroyRegular;
    font-size: 16pt;
 
 
}
      OK tried adding the important attribute didn't appear to work. I already had the color defined here as well as the font-family yeah still no happiness. Seeing as there is an entry in the style.css file explicitly for .post h2 and the only thing it omits is the color I'm assuming the color is defined for it either like Istvan suggest a class called entry-title and probably as part of, or nested in a "a " anchor element. because post titles are links. I just can't figure out where this entry-title class is defined .
      {{ DiscussionBoard.errors[7086840].message }}
      • Profile picture of the author webpeon
        Originally Posted by ronc0011 View Post

        OK tried adding the important attribute didn't appear to work. I already had the color defined here as well as the font-family yeah still no happiness. Seeing as there is an entry in the style.css file explicitly for .post h2 and the only thing it omits is the color I'm assuming the color is defined for it either like Istvan suggest a class called entry-title and probably as part of, or nested in a "a " anchor element. because post titles are links. I just can't figure out where this entry-title class is defined .

        I just checked your site and unless you've made additional changes as well as adding the important rule, than the rule has provided a fix and you may just need to clear your cache to see the results.


        Ideally however you do need to sort that double entry problem, there's so many tags involved its going to be a pain in the butt moving forward..


        The problem is the hierarchy of the styles, everything in that style block on the page will overwrite the style in the css every time, you need to remove the styles on the page so the stylesheet itself will work.
        Signature
        Web 2 Mobile
        The Future of The Web
        {{ DiscussionBoard.errors[7086930].message }}
  • Profile picture of the author rajeevrla
    yeah agree.

    Actually .post h2 tag is defined twice. It seems that it is defined using the style tag somewhere in the page itself, most probably in the header.php or in the index,php file. Either those code will have to be deleted or we need to use the !important attribute in the CSS file to overwrite it.
    Signature

    Have a great day!

    {{ DiscussionBoard.errors[7086510].message }}
  • Profile picture of the author webpeon
    ... more info

    the stylesheet .post h2 css is

    .post h2 {
    margin: 5px 0 10 0;
    font-size: 16pt;
    font-family: DestroyRegular;
    color:#624f27 !important;
    }


    and the style block on the page

    .post h1, .post h2 {color:#000000}


    so regardless of what you do to the stylesheet, if that tags duplicated in the style block then its going to be pointless without the important rule.


    sidenote: you'll want to add a measurement to that bottom margin value (10px not 10) its showing as invalid.
    Signature
    Web 2 Mobile
    The Future of The Web
    {{ DiscussionBoard.errors[7086950].message }}

Trending Topics