How To Add Custom Font

There are two ways for adding fonts

a) Go to your theme folder/functions.php and paste this code:

if (!function_exists('additional_font_styles')) {
    function additional_font_styles () {
        wp_enqueue_style('your_font_name', 'the_url');
    }
    add_action('wp_enqueue_scripts', 'additional_font_styles');
}

Adjust the your_font_name to your preference and the url to the right URL path to the fonts' files. Next, with CSS code apply this font to any part of the website you might want with font-family property.

For example paste this code below into your admin Elated Options > General > Custom Code > Custom CSS field

body, h1{font-family: 'YourFont', sans-serif;}

This handles the API call to your webfont. We suggest that you do this in your child theme and its functions.php file in order to preserve this alterations upon theme update.

b) Paste this code into Custom CSS field:

@font-face {
    font-family: 'MyWebFont';
    src: url('webfont.eot');
    src: url('webfont.eot?#iefix') format('embedded-opentype'),
    url('webfont.woff2') format('woff2'), 
    url('webfont.woff') format('woff'),
    url('webfont.ttf') format('truetype'),
    url('webfont.svg#svgFontName') format('svg');
 }

Just put absolute paths to your font files. Than use this code in CSS field

body, h1{font-family: 'YourFont', sans-serif;}

And style desired elements with appropriate fonts.

Or you could try Use Any Font plugin, some customers have suggested it but we haven't tested it ourselves.

Neither one way adds font to the list inside Elated Options but you will have to use it through custom css code.

*Custom css field could be also places in Appearance > Customize > Additional Css.