Edit heading tag font

  • Author
    Posts
  • #1263590

    Hi guys,

    I’ve set the heading font style to Calluna, but would like the H2 to have a different font (Ubuntu). Is there a way to do this in css? My website is:

    http://acupunctuurpraktijkutrecht.wordpress.com/

    I am using the twenty eleven theme and have the css editor upgrade.

    The blog I need help with is acupunctuurpraktijkutrecht.wordpress.com.

    #1263698
    #1263719

    Volunteers cannot view blogs set to private and cannot assist with any issues they cannot lay eyes on. They can only speculate.

    #1263764

    Sorry about that. Site is visible now.

    #1263765

    timethief
    Member

    Good then when the Volunteers who help with CSS editing click in they will be able to see what’s going on.

    #1263796

    This will give you Ubuntu for h2 in the content areas of pages and posts only. All other h2s will stay the same as they are (if there are any others used in the theme itself). I included three other fonts in the stack as fallbacks in case something goes wrong and Ubuntu doesn’t load.

    .entry-content h2 {
    font-family: Ubuntu-1, Arial, Helvetica, sans-serif;
    }
    #1263856

    Thanks!!! Thats works perfectly.

    Can someone tell me how to remove the white line that is added automaticly after the h2? I have tried different things, but nothing seems to work.

    #1263857

    It worked perfectly in the preview and changing the h2 into ubuntu, but the font hasn’t changed on the website itself. Could it be the general font setting for the font overwrites the css?

    #1263860

    It works for me by adding it to your custom CSS via Firebug. Sometimes Firebug messes up though. Add this instead which is more specific, and leave the font stack as I have it. That is the font stack Typekit had created in a different section of your site. I also used the “!important” attribute (a bigger hammer).

    .wf-active .entry-content h2 {
    font-family: ubuntu-1,ubuntu-2,"Helvetica Neue",Helvetica,Arial,sans-serif !important;
    }

    Perhaps the capital first letter in the other code I gave was messing stuff up in some browsers.

    #1263861

    Yes that works. Thank you so much!

    Can someone tell me how to remove the white line that is added automaticly after the h2? I have tried different things, but nothing seems to work.

    #1263862

    I’m not seeing a white line. Are you talking about the blank space between the bottom of an h2 and the following paragraph text?

    #1263863

    Yes I mean the blank space between the bottom of an h2 and the following paragraph text.

    Is there a way of getting rid of it?

    #1263864

    To the previous CSS, add this declaration and then adjust the em value as desired. This will affect only the h2 in post and page content.

    margin-bottom: 0.8125em;

    #1263874

    Thanks for your help. It’s great the way this forum works.

    #1263876

    You are welcome and thanks.

The topic ‘Edit heading tag font’ is closed to new replies.