How to Change Your Text Size and Color in WordPress

change-text-size-color
Please note: This tutorial is for WordPress.org blogs. If you are still using a WordPress.com blog the process may be slightly different. To utilize the full power of WordPress you may want to consider transferring your WordPress.com blog to WordPress.org.

When writing a post in WordPress you will see a few text options on the post editor screen like bold, italics, and strikethrough. But what if you want to change the size of the text? Or the color?

There is seemingly no simple solution for this on the post editor screen, so I am going to show you some workarounds to get it done. This will involve some light HTML coding, but even if you are a beginner you should be able to copy and paste the examples I give to get your desired effect.

The method I am going to show you should only be used if you want to make changes to just a few words in your post. If you don’t like the overall look of the text on your blog, it is better to just install a new theme on your blog that has a font type, size, and color that you like.

 

Changing Text Color

At first look you probably won’t see an easy way to change the text color. This is because, for some reason, the developers of WordPress decided to hide this feature. Here is how to get to it:

  1. In your WordPress dashboard go to the “Posts” section and click on the post you want to edit.
  2. Once you are on the post editor screen click the “Toolbar Toggle” button just about your post (circled in red below).

  1. This will bring up some extra options in the toolbar above your post. One of these options is a “Text color” drop-down box.

  1. Use your mouse to highlight the text you want to change and then click the “Text color” drop-down box. Choose whichever color you like.

  1. Once you have chosen a color you can click the blue “Update” button on the right-hand side to save your changes.

 

Changing Text Size

Changing your text size follows a process similar to the one we used to change the text color. This one is a little more complicated though. Here is how to do it:

  1. In your WordPress dashboard go to the “Posts” section and click on the post you want to edit.
  2. Once you are on the post editor screen click the “Toolbar Toggle” button just about your post (circled in red below).

  1. This will bring up some extra options in the toolbar above your post. One of these options is a drop-down box that says “Paragraph”.

  1. Use your mouse to highlight the text you want to change and then click the “Paragraph” drop-down box. Choose “Heading 3” to follow along with this example.

  1. Once you choose a text size you will notice that it not only changed the text you highlighted, but all of the text in that paragraph!

  1. To fix this, we need to get into the HTML code of the post. To do this, click the “Text” tab (circled below).

  1. Now that you are in “Text” view you will not only see the text of your post, but also the codes that control things like text size. Look at the paragraph where we changed the text size. Just prior to the paragraph you will see this: <h3>
  2. Just after the paragraph you will see this: </h3>

    These codes mark where Heading 3 (the text size we chose in step #4) starts and stops. In order to change this, and only change the size of the text we want, we need to move those codes to the appropriate place. Take a look at the screenshots below to see how to do this:

    Before:

    change-text-size-6

    After:

    change-text-size-7

  1. As you can see, all you need to do is copy and paste the codes to surround the text that you want to change. Once you have done that you can click the blue “Update” button on the right-hand side to save your changes.

 

In addition to changing text size and color, when you click the “Toggle toolbar” button you will see some other new features. These include useful things like underlined text and indentations, so keep the “Toggle toolbar” button in mind in case you need to use these features in the future.

  1. Really I didn’t know about the toggle bar available on wordpress.org. But thanks for this precious information of changing the color of text in wordpress.Thanks a lot. Happy blogging.

  2. Is it possible to change the default color when editing? I think the default grey is too light. It is hard for the eyes to look at for a long time.

  3. Where is the blue update button you are talking about? I am highlighting my text and then picking a color. nada nothing changes. And there is no blue update button anywhere

  4. Thank you for this. I’ve been using WordPress for 3 years and have always wanted to change the text color easily Now I know how easy it is to do so without messing the HTML code. Thank you again for this blog post.

  5. Thank You so Much. You will think by default this should be set to On, but the theme I am using had the “toggle” bars hiding the other necessary text features. I salute.

  6. I am so glad you wrote this. It was driving me crazy. I am using a macbook instead of my normal PC and I can’t get word document to save my post to my blog so I have to copy and paste it but it wouldn’t save the color of the text. I have been looking for a way to change it for about a week now. I can’t believe the darn thing was this easy to change. Thank you so much.

  7. Thank you for posting this! I have been trying to find a way to change part of my H1 header and all I could find was how to do it through coding – As I am not a web developer I had absolutely no idea what they were talking about!! 🙂

  8. Thank you so much for this! I am trying to figure out how to alter my theme, but in the meantime it was great to be able to find your easy way of just altering the text colour of my latest post so it wasn’t that annoying grey 🙂

  9. Thanks Mr. Chow for the simple and clear explination that a beginning blogger needs! Keep on doing the good work for us tech noobs!

Leave a Reply

Your email address will not be published. Required fields are marked *