Load the Font
1. First, go to Google Fonts and pick a font (Roboto font is used as an example).2. After you pick a font, click on it -> click on "SELECT THIS FONT" -> click on "FAMILY SELECTED".
3. Click on "CUSTOMIZE" and pick the styles you want.
4. Then click back on "EMBED" and copy the part that comes after this:
<link href="https://fonts.googleapis.com/css?family=
5. The selected part in the screenshot below is what you need to copy ("Roboto:400,400i,900,900i"):6. Then go to your blog dashboard -> Theme -> Edit HTML and you'll see the Google Fonts code (it's between <!-- GOOGLE FONTS -->).
7. And, directly after the last font, add this:
|Roboto:400,400i,900,900i
8. The finished code has to look like this: <link href='https://fonts.googleapis.com/css?family=Font1:style1,style2|Font2:style1,style2,style3|Roboto:400,400i,900,900i' rel='stylesheet' type='text/css'/>
Edit the CSS
The post body font will be edited as an example.1. Go to Theme -> Edit HTML.
2. Click anywhere on the code once (necessary).
3. Press CTRL+F (or CMD+F on Mac) and paste this in the small search box that appears:
body {
4. Change the font-family from font-family: 'Font Name', serif/sans-serif; to font-family: 'Roboto', sans-serif;.5. Change the font-weight, too. It's usually 400 for the regular version of most fonts, but it depends on the styles you've selected.
6. Click on "Save theme" and you're done.