Friday, 25 January 2008

How to Change the Post Text Size Only

Fearful of running this subject in the ground, I'm at it again. Reason being is I'm on the edge of OCD and this is what I do :-) In BlogU I explain changes I make to a template. And I like things to be written out in no uncertain terms.

While designing Pink Stitches I wanted to change the post font size only. Not the date font size or anything else tied into that code. So, I modified the code from this series of posts:
  1. Choices for Post Body Fonts
  2. Change the Date Header Font Easily
  3. Change the Post Title Font Easily
The following instructions will allow you to change the size of the post text only. Open your Dashboard | Template | Edit HTML. Look for the /* Variable definitions section. Add this code to that section:
<Variable name="postfont" description="Post Font" type="font" default="normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 113% Verdana, sans-serif"></variable>
Next find the post section of the CSS style sheet.
.post {
margin:.5em 0 1.5em;
border-bottom:1px dotted $bordercolor;
padding-bottom:1.5em;
}
Add this line to it:
.post {
margin:.5em 0 1.5em;
border-bottom:1px dotted $bordercolor;
padding-bottom:1.5em;
font: $postfont;
}
Save your template. Once again go back to your Dashboard | Template | Fonts and Colors. There will be a new listing in the scroll box called Post Font. Now changes can be made to the post font with only a click!


post signature

No comments:

Post a Comment