Wednesday, April 01, 2020

Blogger: Change Background Color & Text Size

I have a blog at Blogger. Recently my friends ask me if I could change the background color and increase font size for my posts. After search on web, soon I found solutions.

Change Background Color

First go to Theme, then Edit HTML.

Expand line 9, b: skin section.

Search for "post.background.color". You will find this as variable definition.

In my Blogger, it is located at line 32: Make a copy the variable first. Then you can make change:

  1. <Variable name="post.background.color" description="Post Background" type="color" default="#ffffff" value="#353d4a"/>
  2. <Variable name="post.background.colorDeleted" description="Post Background DELETE" type="color" default="#ffffff" value="#1c1c1c"/>

Make sure the description on line 2 is not as same as description on line 1. I think that the description is a key for variables.

This variable is used for the class of post.outer

Change Font Size

Another change I would like to do is to enlarge text size of post.  This is very easy to do. Find "post-body" in HTML template

In my Programmer's blog, I could not find post-body. The size of text is defined in body class.