Declaring a custom font in your WordPress theme is very useful for personalizing it and adapting it to your graphic charter. However, sometimes the font of your dreams is not found in your theme options, nor on Google Fonts or TypeKit.

In this case, you will have to tweak your theme a little to add the font you want. But don't panic, I'll explain how to do it!

Download the font

First, you need to have the font, either by downloading it from font sites like dafont for example, or by your own means.

Beware of copyright, which you must respect. Do not hesitate to purchase the font when necessary. You will only be paying those who worked on it so that you can enjoy it!

TTF and OTF formats are currently widely used, and are compatible with most browsers. However, if you need to convert the font to other formats, go to Font Squirrel.

Upload the font to your server

Upload your font to a “fonts” folder in your theme (preferably child theme), via FTP.

Declare your new font in your CSS

Go to the CSS file of the child theme if you have uploaded the font in the “fonts” folder of the child theme, otherwise in the CSS file of the parent theme, or in the settings of your theme if it allows you to customize CSS via the WordPress backoffice. Here's how to do it:

@font-face { font-family: myfont; src: url("fonts/mapolice.otf"); src: url(fonts/mapolice.ttf) format('truetype'); font-weight: normal; }

Use the new font via CSS

To use your newly declared new font, nothing could be simpler, you just need to tell the CSS file which formats you want to assign the font to:

p,span {font-family: mapolice, Open Sans, Arial, sans-serif !important;} h1,h2,h3,h4,h5,h6 {font-family: mapolice, Open Sans, Arial, sans-serif !important;} ;} div {font-family: mapolice, Open Sans, Arial, sans-serif !important;}

And there you have it, if this article helped you, don’t hesitate to share it on social networks 😉