Return to previous page

Adding Custom fonts - by KilroyWasHere - on WordPress WooCommerce support

This topic has 7 replies, 3 voices, and was last updated 9 years ago ago by Robert Hall

KilroyWasHere

Participant

December 10, 2015 at 08:32
Hi,
I’m trying to add custom fonts to my theme. I’ve followed some tutorials online, and this is what I have done:

-I’ve enabled the Custom CSS file option under the Theme Options/Custom CSS
-I’ve added the custom.css file to my wp-content/themes/woopress directory
-I’ve added the webfonts to my wp-content/webfonts folder
-I’ve added the following code to my custom.css file:
```
@font-face {
    font-family: ‘daft_brush’;
    src: url('http://www.diewasgoedlyn.co.za/wp-content/WebFonts/DaftBrushWebFonts/daftbrush-webfont.eot');
    src: url('http://www.diewasgoedlyn.co.za/wp-content/WebFonts/DaftBrushWebFonts/daftbrush-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://www.diewasgoedlyn.co.za/wp-content/WebFonts/DaftBrushWebFonts/daftbrush-webfont.woff') format('woff'),
         url('http://www.diewasgoedlyn.co.za/wp-content/WebFonts/DaftBrushWebFonts/daftbrush-webfont.ttf') format('truetype'),
         url('http://www.diewasgoedlyn.co.za/wp-content/WebFonts/DaftBrushWebFonts/daftbrush-webfont.svg#daft_brush’) format('svg');
    font-weight: normal;
    font-style: normal;
}

h1{
font-family:'daft_brush', Arial, sans-serif;
}
```
But it doesn’t change the font of my Heading 1. Not sure what I am doing wrong?
#103670 Copied
6 Answers

Jack Richardson

Support staff

December 10, 2015 at 09:02

Hello,

Please show a page where font should be changed.

Best regards,
Jack Richardson.

#103683 Copied

KilroyWasHere

Participant

December 10, 2015 at 09:31

I want to use it in my posts as well as in the Revolution slider.

Revolution slide has a tutorial on adding manual fonts (http://www.themepunch.com/faq/use-fonts-google-fonts/) but then it is just available in revolution slider. I also want to use it in the blogs and headers on my website. So I figured adding it I tried testing it on h1 first, but after adding the above code, it does not change the font of the h1 in my demo posts. So now I’m wondering if I’m adding the css correctly.

It is not just one page I want to change this, I want to use it all over the website. Pages, blogs, etc.

#103692 Copied

Robert Hall

Support staff

December 10, 2015 at 09:42

Hello,

You can add the google fonts in Dashboard->Punch Fonts.

Regards,
Robert Hall.

#103696 Copied

KilroyWasHere

Participant

December 10, 2015 at 09:55

Hi Robert,

The fonts that I want to use are not available on Google fonts.
It is custom web fonts I bought, and loaded on my server. I want to use fonts other than Google Fonts.

Please see the above thread.

#103702 Copied

KilroyWasHere

Participant

December 10, 2015 at 10:09

It is fine, I found a plugin that lets me do the custom fonts:
Use Any Font

If anyone else wants to use the same.

#103709 Copied
Robert Hall

Support staff

December 10, 2015 at 10:16
I’ve added this code in Global Custom CSS. Please check.
```
h1{
font-family:'daft_brush', Arial, sans-serif !important;
}

h2{
font-family:'brushup', Arial, sans-serif !important;
}

h3{
font-family:'thirstyroughregularthree', Arial, sans-serif !important;
}
```
Regards,
Robert Hall.
#103713 Copied
Tagged: custom fonts, design, styling, themes, woocommerce, wordpress
Viewing 7 results - 1 through 7 (of 7 total)