How to insert your own fonts in WordPress

Typography is often a discussed topic in design. The wrong font can destroy the professional expression on your website. By contrast, a good font that fits the style and tone of your website or product can help you a lot.

There is a lot of free fonts on the internet to choose from, but you should often look for a while to find the perfect font for your website, product etc.

Adobe Typekit and Google Fonts a brilliant websites to finde the right font. They make it easy and manageable to look through the different fonts. It can be a great idea to add fonts to your WordPress site, so here is a little guide of how to do it.

How to add a Google font to your Divi website.

1. Choose your font

 

Copy this link which is under standard <link href=”https://fonts.googleapis.com/css?family=Ranga” rel=”stylesheet”>

2.  Add to Header code

 

 

Go to Divi theme settings > intergration > past the code in head (not body) and save.

3. Give the font classes, tags and elements

 

Go back to the website Google Fonts and go to: integrate the fonts into your CSS and copy the code. In our case we will write:

font-family: ‘Ranga’, cursive;

Now you have to add the elements in Divi theme settings > General > Custom CSS. If you want header 1 and 2 to have the new font, you can use the code:

h1, h2 {
font-family: 'Ranga', cursive;
}

That’s all for now! Contact us if you have any questions.

 

Meld dig til vores nyhedsbrev

Meld dig til vores nyhedsbrev

Meld dig til vores nyhedsbrev og få spændende nyheder hver uge!

Du er nu tilmeldt nyhedsbrevet!