How to Add Custom Fonts Using @Font-Face

Step 1 — Navigate to Appearance > Theme Editor from WordPress Dashboard.

Step 2 — Within the Theme Editor click into your themes style.css file and write a @font-face query to reference your custom font.

Writing a @font-face Query #

You can write the query for your custom font:

@font-face {
font-family: CustomFont;
src: url(public_html/cpanel-username/wp-content/themes/your-theme/fonts/CustomFont-Regular.ttf);
font-weight: normal;
}

CustomFont can be replaced with any name you like.

src: url(public_html/cpanel-username/wp-content/themes/your-theme/fonts/CustomFont-Regular.ttf);