2009-06-09

Expandable Blogs

OR HOW I GOT VARIABLE SIZED CONTENT:

After doing some research on the subject I found that I could edit my template. I had chosen a pretty plain template (minima black) because I want my blog to match my web site.

I edited the template by going to the blogger dashboard >> Customize >> Layout >> Edit HTML. (Be sure to save your template before you make any changes.)

The “wrapper” variables are what determine the different widths of your blog. I changed the hard-coded widths to percentages instead of pixels, shown as px. Note that I am not showing all code, just the pertinent portions. I had to play around with the percentages until I found a combination that worked for my layout.

#header-wrapper {
width:90%;

#outer-wrapper {
width: 95%;

#main-wrapper {
width: 75%;

#sidebar-wrapper {
width: 20%;

Now that I have figured that out, I want to work on creating a layout that has a border around it. But I want the post section to be expandable. All of that will have to wait until after the CWS and the dog show in OKC.

3 comments:

KBeau said...

I actually approached this same task today, but I did it a little differently. At first I had decided to change to the minima stretch layout, but I didn't like that I couldn't have a "center" section that was different from the main background. The minima stretch was just too wide.

So I went back to the two column layout and changed it up. Here's what I did:

I changed the #outer-wrapper width to 900px. Then I changed the #main-wrapper width to 600px and the #sidebar-wrapper width to 270px.

Then I created a new background that was similar to the old one but with a wider center section and stitching along the edges instead of the lace.

So far all of this is just on my test blog, which you can see here:

http://kbeautest.blogspot.com/

KBeau said...

One more thing. When I started playing with the two-column layout, I was using the minima template.

Baumbastic said...

I used the minima black template to format my blog.