Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Peter Cusack
Peter Cusack
2,622 Points
Posted by Peter Cusack
Peter Cusack
2,622 Points

How to properly import a custom font into wordpress

I have a font from iconmoon and I am having trouble importing it into wordpress with wp_enqueue_style. Here is the import rule I currently have in my css.

@font-face {
font-family: 'icomoon';
src:url('../fonts/icomoon.eot?oj69n4');
src:url('../fonts/icomoon.eot?#iefixoj69n4') format('embedded-opentype'),
url('../fonts/icomoon.woff?oj69n4') format('woff'),
url('../fonts/icomoon.ttf?oj69n4') format('truetype'),
url('../fonts/icomoon.svg?oj69n4#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}

Any ideas on how I would go about doing this?

2 Answers

Zac Gordon
STAFF
Zac Gordon
Treehouse Guest Teacher
Zac Gordon
Zac Gordon
Treehouse Guest Teacher

The url path is based on the location of the CSS file. If this code is going in your style.css then remove the ../

On a related note, is your css file actually loading properly?

Peter Cusack
Peter Cusack
2,622 Points
Peter Cusack
Peter Cusack
2,622 Points

Yes, all the css is working properly. I got it working from the css but I was wondering if there is a way to important a custom font from functions.php like you do a google font. But it's not a big deal it works just fine importing it from the css. I do have another question though https://teamtreehouse.com/forum/how-to-change-what-the-a-surrounds-in-a-wordpress-nav-menu

Zac Gordon
STAFF
Zac Gordon
Treehouse Guest Teacher
Zac Gordon
Zac Gordon
Treehouse Guest Teacher

Yes, you can and should enqueue all your CSS from the functions.php file.

wp_enqueue_style( 'googlefont_css', 'http://fonts.googleapis.com/css?family=Asap:400,700,400italic,700italic' );