FYI: Posts will be sparse around here until I replace my laptop.... Coming back to work after Christmas break apparently was too hard and it quit on me!

01 May 2012

Tuesday's Tips - Customizing Post Date Title Format

To customize the post date title format you're going to look for this code in your template:
h2.date-header

The CSS inside the brackets {} following that code will control what your post titles look like.
You can customize the code however you'd like--be creative! You can use my CSS Basics posts on Borders, Backgrounds, Text, and Padding & Margins for specific codes. If you have any questions on how to do something specific, ask in a comment and I'll get back as soon as I can.

For example, my current post title code looks like this:
h2.date-header {
font-family: Georgia;
color: #8f8f8f;
font-size: 14px;
font-style: italic;
float: right;
display: inline;
}

4 comments:

Joy

Emily, thanks for this tip! Can I ask how do you change the body font and size of the post itself? I've not been awfully pleased with the size of my post body font... so I'd be delighted to know how :).

Thanks!
~Joy

Emily Grace

Joy - The body font is controlled by the body code in your template. So for example mine looks like this:
body {
background-color:#ffffff;
color: $textcolor;
font-family: 'georgia', sans-serif;
font-size/* */:/**/small;
font-size: /**/small;
font-size: 12px;
line-height: 1.5em;
margin: 0;
padding: 0px 0 20px;
}


If you want to change the width of your posting area refer to this post. Does that help? :)

marcia

I have a teeny problem... I have my post date header customized exactly how I want it, but it put it's self on the same line as my post title. I want it to be on the first line, and have my post title underneath it...
I'm pretty sure the problem is in the display: inline; but I don't know what text to use to replace inline. does that make sense? thank you so much!

Emily Grace

Marcia - You could try replacing it with 'block' or 'block-inline'. Otherwise I'd suggest fiddling with the margin/padding for your post date and/or post title. Hope this helps!

Post a Comment

Leave your thought...