Menu

Helping Benjamin – How to (easily) Use Different Fonts and Sizes in WordPress Posts

by | Websites

TinyMCE Fonts and Sizes in WordPress

Relevant for: WordPress Users

Average Time: 5 minutes

Today we’re breaking down how to change basic fonts and styling in WordPress posts without getting our hands dirty with behind the scenes coding. WordPress doesn’t give you many text styling options because it’s built on a coding language called CSS. Ben of creativecourage.com called on us to help him figure this out, and luckily there’s a simple WordPress plugin to get us started without needing any code experience. The TinyMCE plugin Advanced (pictured above) adds several additional formatting bars to the WordPress edit window, including a styles option for custom fonts, sizes, colors, and more. It’s not perfect, but it’s much better.

1. Install TinyMCE Advanced into WordPress

  1. Login to WordPress
  2. Click Add New Plugin under the Plugins header on the left sidebar
  3. Enter TinyMCE into the search field and perform the search:
  4. The search results should then show the plugin. Clicking on install will download and install the plugin.
  5. When finished, activate the plugin!

2 Customizing Text

  1. Open a new or existing post (click Add New under the Posts header on the left sidebar).
  2. Select the text you’d like to customize within the edit field.
  3. Click the now available “Styles” button
  4. Choose preferred styles and click apply
  5. Continue editing post

Advanced Tips: If you have trouble changing the font or color of text in the middle of a sentence, select the HTML editing view, and use the “span” command like this example, “<span style=”color: #828a75;”> It’s not perfect, but it’s much better.</span>” that you can see in the first paragraph. Also be sure to check out the plugins other features for customizing the editing toolbar by clicking TinyMCE Advanced from under the Settings header on the sidebar.

Note: You will only be able to edit content within the post creation field, not the outer elements like the sidebar titles or post titles, they require direct CSS code editing.

If you found this article useful, why don’t you try asking you’re own question now for FREE. Ask now.