Once you generate the font, you’ll get a ZIP file containing the appropriate files. First, upload the generated font files (they’ll end with .eot, .svg, .ttf, .woff, and .woff2) to your server using FTP, cPanel, or whatever file management application your host provides. Note the locations of these files, because you’ll need it in the next step.
Next, open the file named stylesheet.css and you should see something similar to this:
/* Generated by Font Squirrel (https://www.fontsquirrel.com) on February 13, 2015 */
@font-face {
font-family: 'inconsolatamedium';
src: url('inconsolata-webfont.eot');
src: url('inconsolata-webfont.eot?#iefix') format('embedded-opentype'),
url('inconsolata-webfont.woff2') format('woff2'),
url('inconsolata-webfont.woff') format('woff'),
url('inconsolata-webfont.ttf') format('truetype'),
url('inconsolata-webfont.svg#inconsolatamedium') format('svg');
font-weight: normal;
font-style: normal;
}
This is the code that tells the browser about your new font and where to find the files. You’ll use font-family to refer to this font (in this case, I’d use font-family: inconsolatamedium; in my CSS). You’ll need to change the values in src: url() to point to the correct locations of the files, which you should remember from the first step.
Finally, copy and paste the entire block of code into your child theme’s stylesheet or your custom CSS plugin. You should be good to go.
