How to change font-family of the headers, like h2?

Question

This problem is kinda weird:

I've added a new font-family and it is being applied to everywhere in theme, except the homepage intro headings.

I added a code manually (selecting the exact class through inspect element).

.h2.text-heading-default{
    font-family: "tahome";
}

And I expect it should solve the problem but the headings are still showing the previous fonts.

What is the solution for this?

Stuff that I tried:

I used "!important" next to the code above
Cleared browser cache
Cleared WP cache
Checked header.php file for anything like tag or conflict, nothing found
Checked the font family file, it is there and already being applied to everywhere in the theme, except the intro headings

Still nothing worked.

Your problem might be specificity, you can test this by adding a ID to the H2. See the answer to this question: https://stackoverflow.com/questions/4616964/css-important-not-working — Katie, Dec 25 '20 at 13:41

score 2 · Answer 1 · answered Mar 05 '21 at 19:33

<!DOCTYPE html>
<html>
<head>
<style>
h2.textstyle {
    font-family: tahoma
}
</style>
</head>
<body>
<h1>This is a Heading</h1>
<h2 class = "textstyle">Changing text style to tahoma</h2>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

</body>
</html>

Could there perhaps be an error in the name of the text style with it being called 'tahome' because I tried, that it didn't work, but when I did the above code in html, for 'tahoma' it worked.

score 0 · Answer 2 · edited Dec 25 '20 at 11:20

0

.h2.text-heading-default {
  font-family: 'tahome' !important;
}

Just add '!important' in front of font-family name.

edited Dec 25 '20 at 11:20

Mario Petrovic

7,500
14
42
62

answered Dec 25 '20 at 06:32

Tanju Karakaya

1
2

score 0 · Answer 3 · edited May 07 '23 at 22:45

0

Perhaps the header has a "!important" tag in the font-family css. If so, you can remove the "!important" word in the header css or add "!important" to your class.

edited May 07 '23 at 22:45

Jasperan

2,154
1
16
40

answered Dec 25 '20 at 06:42

Mahdi

1

there is no "!important" in the header.php file. Same for the style.css file. I'm using Visual Composer btw – joseph Dec 25 '20 at 11:21

Soham Grover · Answer 4 · 2020-12-25T10:36:50.073

Many People have already answered, but let me tell you again that you need to add !important to it. If this doesn't work, then try simplifying the code.

.h2 /* Try writing this only*/ {
font-family: "tahome" !important;

}

Also check if there are any mistakes in HTML code. You can post the HTML code in Stackoverflow for re-checking.

And yes, I'm not really sure but if this isn't working, it may be possible that the font-family you installed doesn't support the headings. Try downloading another font=family.

Bye. Have a great day!

How to change font-family of the headers, like h2?

4 Answers4