Adding Custom Fonts in WordPress Using CSS3 @font-face

First thing you need to do is download the font that you like

Once you have the font files, you would need to upload it on your web hosting server.

The best place to upload the fonts is inside a new “fonts” folder in your theme or child theme‘s directory.

You can use FTP or File Manager of your cPanel to upload the font.

Once you have uploaded the font, you need to load the font in your theme’s style sheet using CSS3 @font-face rule like this:

    @font-face {

        font-family: Arvo; 

        src: url(http://www.example.com/wp-content/themes/your-theme/fonts/Arvo-Regular.ttf); 

        font-weight: normal; 

    }

Don’t forget to replace the font-family and URL with your own.

After that you can use that font anywhere in your theme’s style sheet like this:

    .h1 site-title {

    font-family: "Arvo", Arial, sans-serif;

    }