I seem to notice in class that you are not really pushing the limits of the templates as much as you should. These templates are a fabulous start out point, however left in their default state they will hardly be adequate to suit any sort of ambitious design criteria. They are not even meant to do so - they are meant to be modified! And, as far as I can see, very few of you are modifying them to the extent where they will really suit your needs.
So, I have decided to do a few examples for you. Here is the first one: My visual communication history blog was long overdue for an overhaul, so it will be a good one to work on for this.
So, I have decided to do a few examples for you. Here is the first one: My visual communication history blog was long overdue for an overhaul, so it will be a good one to work on for this.
As visual material I have modified an earlier photoshop file, so nothing new there. I did make some new header typography for it, however. Which I may still change, not entirely happy with it yet...
The template that I have used is one of the subcategories of awesome inc, and as a matter of fact it is that particularly nasty looking pink one with the white band underneath the header. So, yes, it did take quite a bit of work to get this to look the way that I wanted it to look.
What I did want out of this was a semi transparent background for the widget area. To get rid of all the white stuff I went into the code and replaced the image file which they had used with my own image file, a tiny 16 x 16 pixel semi transparent dark gray 24 bit png file, which I had previously uploaded to Picasa. (Tip: just do a ctrl+F for "http" and you will find all of it, since it is one linked image which has been used several times. And after that it is just a matter of replacing it with yours ).
Next thing was adjusting all of the line heights. Which meant pasting this code into the CSS box all the way on the bottom on the advanced tab of the template editor. This is a really great thing (almost as good as the split window in Dreamweaver), since you can see the changes take effect as you are tweaking. The parameters you need to play with are highlighted in black:
What I did want out of this was a semi transparent background for the widget area. To get rid of all the white stuff I went into the code and replaced the image file which they had used with my own image file, a tiny 16 x 16 pixel semi transparent dark gray 24 bit png file, which I had previously uploaded to Picasa. (Tip: just do a ctrl+F for "http" and you will find all of it, since it is one linked image which has been used several times. And after that it is just a matter of replacing it with yours ).
Next thing was adjusting all of the line heights. Which meant pasting this code into the CSS box all the way on the bottom on the advanced tab of the template editor. This is a really great thing (almost as good as the split window in Dreamweaver), since you can see the changes take effect as you are tweaking. The parameters you need to play with are highlighted in black:
line-height: 140%;
}
.post-body {
line-height: 1.7;
}
li{
line-height: 140%;
}
And then finally, all the other colors, etc, were fixed in the advanced editor as well. And, now I have a brand new look on my blog! See it in action here:
http://visualcommunicationhistory.blogspot.com/
You can also download the template from here >>>
http://visualcommunicationhistory.blogspot.com/
You can also download the template from here >>>
.................................................................................................................................