Edit heading tag font

acupunctuurpraktijk · Member · May 10, 2013 at 4:57 pm
Copy link

Add topic to favorites
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:

Welkom bij Acupunctuur Praktijk Baidu, Utrecht

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

The blog I need help with is: (visible only to logged in users)
acupunctuurpraktijk · Member · May 10, 2013 at 5:06 pm
Copy link
The page I’ve been experimenting on is:

Hooikoorts en acupunctuur
thistimethisspace · Member · May 10, 2013 at 5:38 pm
Copy link
Volunteers cannot view blogs set to private and cannot assist with any issues they cannot lay eyes on. They can only speculate.
acupunctuurpraktijk · Member · May 10, 2013 at 7:29 pm
Copy link
Sorry about that. Site is visible now.
timethief · Member · May 10, 2013 at 7:32 pm
Copy link
Good then when the Volunteers who help with CSS editing click in they will be able to see what’s going on.
thesacredpath · Member · May 10, 2013 at 9:12 pm
Copy link
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;
}
```
acupunctuurpraktijk · Member · May 11, 2013 at 4:35 pm
Copy link
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.
acupunctuurpraktijk · Member · May 11, 2013 at 4:44 pm
Copy link
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?
thesacredpath · Member · May 11, 2013 at 10:31 pm
Copy link
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.
acupunctuurpraktijk · Member · May 12, 2013 at 3:01 pm
Copy link
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.
thesacredpath · Member · May 12, 2013 at 4:44 pm
Copy link
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?
acupunctuurpraktijk · Member · May 12, 2013 at 5:51 pm
Copy link
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?
thesacredpath · Member · May 12, 2013 at 11:27 pm
Copy link
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;
acupunctuurpraktijk · Member · May 13, 2013 at 6:36 pm
Copy link
Thanks for your help. It’s great the way this forum works.
thesacredpath · Member · May 14, 2013 at 5:51 pm
Copy link
You are welcome and thanks.

No items found.