using custom fonts in HTML format in wordpress

Question

I followed a tutorial on how to upload fonts to wordpress (see link below). I've done all the steps including uploading to the ftp, changing header.php to include the font stylesheet, etc as lined out in the below link:

http://www.wphub.com/tutorials/adding-custom-fonts-wordpress-website/

what i added to header.php (I believe I changed everything I needed to correctly):

<link rel="stylesheet”  href="<?php bloginfo('template_directory'); ? >/aileron/stylesheet.css"></li>

1) What's confusing me is Steps 11-12. I just tried to call out my font in a page but it did not work….i don't know what needs to be placed in the main style sheet for my wordpress theme…

@font-face {
font-family: 'aileronblack';
src: url('aileron-black-webfont.eot');
src: url('aileron-black-webfont.eot?#iefix') format('embedded-opentype'),
     url('aileron-black-webfont.woff') format('woff'),
     url('aileron-black-webfont.ttf') format('truetype'),
     url('aileron-black-webfont.svg#aileronblack') format('svg');
font-weight: normal;
font-style: normal;

}

2) i'm not sure I'm calling out the fonts correctly:

<span style="font-family: 'aileronblack';"> Test</span>

Anything you can provide me will help immensely.

Answer 1

You should register and enqueue your styles in your functions.php file.

wp_register_style( 'aileron', get_template_directory_uri() . '/aileron/stylesheet.css', array(), '1.0', 'all' );

wp_enqueue_style( 'aileron' );

Which browser are you using to view your site? Some browser need specific font format:

See link

Are the custom fonts located in the same folder as the stylesheet?

Your font should be called correctly, unless the stylesheet isn't loaded. You can check the source code in a browser to see if the stylesheet is getting loaded.