How to Change Font Type & Size in WordPress

There are two basic ways to change the font in your WordPress theme. Firstly you can edit the CSS “style.css” file to change the font globally on all of your posts and pages. The other way to do it is to install various WordPress plugins that will allow you to change the font as you write your post.

Changing Your WordPress Font Globally

To change your font globally login to your WordPress dashboard and click on Appearance > Editor.

changing-fonts-part-1

On the right click on the stylesheet which should have the name “style.css”. Make sure you have the right file before doing any editing.

changing-fonts-editing-stylesheet

From here you’ll need to insert the following code:

* {font-family:”Courier New”, Courier, monospace}

You can use a different code for a different font. The * at the front of the line indicates that this font should be used for all text on the website.

A specific font has a generic font family. If a font name has more than one word you need to put it in quotation marks as in “Courier New”. If a browser can’t find one font it will revert to another more generic font. That’s why in the example above we’ve included three names instead of one.

Another example is:

* {font-family: “Times New Roman”, Times, serif}

You may need to clear your browser cache to see the changes taking effect.

Adding Google Fonts to WordPress

The Google Fonts look quite nice and you may want to integrate them into your WordPress theme. You can do this quite easily with the WP Google Fonts plugin. In your dashboard go to Plugins > Add New and do a search for “WP Google Fonts”. When you find it click on “Activate”

wp-google-fonts-plugin

Now in your Dashboard you should have “Google Fonts” on the left menu. Click on it to edit the Google Font settings. You can set up a number of different fonts to replace the usual Heading 1, Heading 2, Paragraph, etc. fonts. Below I’ve set up to have the “Paragraphs” font in Arimo, which I find quite easy to read.

wp-google-fonts-selection

You can have a look at all of the 800+ Google Fonts by going to fonts.google.com. That’s all there is to it. Some themes may conflict with the Google Fonts plugin. If this is the case you may need to type in custom CSS. If you’re not sure how that works follow the help tips at the bottom of the plugin settings page.

Changing Font Size

Font size for all text types are usually defined in the style.css stylesheet. Most people aren’t confident enough to make changes to their theme stylesheet so it’s easier to make font size changes using a plugin such as TinyMCE Advanced.

To install TinyMCE Advanced click on Plugins > Add New and then do a search for “TinyMCE Advanced”. Once you’ve found it click on “Install” and then “Activate”. The plugin should now appear in your Plugins > Installed Plugins section.

This plugin will add extra options when editing a post or page in WordPress. There’s a lot here you can play around with but two of the most important settings are “Font Family” and “Font Sizes“. You can see all of the available settings below (click to enlarge the image).

tinymce-advanced-settings

Now when you are writing a post simply click on “Font Sizes” and select the font size that you’d like for your post. You can select individual parts of your post to be a different size then the rest or keep the entire post at one size.

I hope this has been helpful and good luck with your WordPress blogging!