How to Change Blogger Post Font Style, Size and Color?

In this tutorial, I will guide you on how to change your Blogger font style based on your preferences. First of all, you can pick your favorite font style in Microsoft Word if you have one installed on your PC or look for a list in Google. Not all font styles are supported but most of them are working. You can mix different styles in your blog. For example, you can use Segoe UI in the body part of each blog post and then you can use Calibri for your blog tabs. Here is the list of blog sections wherein you can manipulate the font style:

1. Post Body
2. Blog Title
3. Blog Description
4. Tabs
5. Date Header
6. Post Title
7. Gadget Title
8. Gadget Text

Let’s say you want to apply Chaparral Pro in post body:1. Log-in to your Blogger account.
2. Go to Template.
3. Click Edit HTML.
4. Find this code: and look for this line: value=”normal normal below it.
5. Commonly, the default font style of blogger templates is Arial. You just need to change the first font style name after this line code: value=”normal normal XXpx

Example: value=”normal normal XXpx Chaparral Pro,

Change Blogger Font Style

6. Save your work. Click Save Template and check if the font style is showing properly in your blog.

If you want to change the font style of other blogger sections, just find the line codes below and do the same procedure above.

1. Blog Title

2. Blog Description

3. Tabs

4. Date Header

5. Post Title

6. Gadget Title

7. Gadget Text
If you want to change the font size, just edit the XXpx before the font style name.


UPDATE:

If you followed the steps above and it doesn’t work on your blog, you may follow this alternative solution:

1. Login to Blogger.
2. Go to Templates tab
3. Click Edit HTML.
4. Find this code snippet or just the first line (CTRL + F):

body, .body-fauxcolumn-outer {
font: normal normal 15px Malgun Gothic, Tahoma, Helvetica, FreeSans, sans-serif;
color: #000000;

5. If you want to change post body font style, replace the highlighted font name in Blue. Replace only the first font after font size.
6. If you want to change post body font size, replace the highlighted px (pixel) value in Violet.
7. If you want to change post body font color, change the hex value highlighted in Red. Don’t omit the # sign before the 6 digit hex code.

Where to get the hex code of your desired color? Go to this link to generate hex code.

8. Save Template then check your blog.

Note: By following these steps, the footer widgets’ font style in your blog will be changed as well. e.g. Attribution 

Comments

  1. By HiSTAR on

    Hi..!
    How do I edit posts on my blog?
    I downloaded from the internet a theme for my blog.
    And the text of each post appear one after the other, and I’d like to be one under the other.
    How can I change this in HTML theme of the blog?

    Excuse me, but do not know very well english …. I greet you with respect!

    Reply

  2. By Mo Jo on

    Hi there! This is the most helpful instructions yet. I’ve changed all other fonts except for some reason post body is not working for me. Do you know if “Quicksand” is not available for post body? It’s a Google font, so I would think it would work. Any help would be great!! theangledcoast.com

    Reply

Leave a Reply

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

Back to top ▴