Make center column variable width in Zen foundaton

[Jonathan Simonoff]

When not using the full page width option, the colums on a Zen Foundation page are all fixed width, and I can't find a setting in the brand designer that changes that. The effect is that when the user makes the page wider, the content stays the same.

What I'd like is to have the center (main) page panel always behave as it does wih the full width option -- it fills up the available space (width apparently set to 100%).

FWIW, I've tried (using the Chrome developer tools) explicitly setting "width:100%" on the center column, and it doesn't do what I'd expect -- the width of the column is still fixed, though a bit wider than the default.

I've also tried removing the side panels from the master page. In that case, the center (now only) column is still fixed-width.

Finally, I tried setting width to 100% explicitly on the main zen section on one of the pages. Again, the setting seems to be mostly ignored -- the section is still fixed-width.

[Kelli Hoyt · Accepted solution]

Aha! I got it now. Thanks for clarification.

Although Zen does have the option as a user-setting in the toolbar to view the site in full-width (albeit that left column is still stretchy-width, not fixed as you'd like), the product was not built with the option for a "stretchy"-designed theme. (This may not be of help, but note that there is also the "expando" button in the toolbar, which expands the main column to full width, and there are a couple of macros you can use that invoke the same thing - one upon click, and the other as a permanent setting for the page.)

We are really happy to share, though, that you can build a theme that is close to what you are describing above in our "next generation of Zen" new product, Theme Press (currently in beta, but 1.0 release is imminent.)

Currently, the product would allow what you are asking, except that that left column is currently only available as also stretchy. We are looking at options, however, to offer a fixed-left-column within overall stretchy layout in a future release.

Cheers,

Kelli

[Jonathan Simonoff]

Thanks, Kelli. Theme Press does look like it might be the right thing for us.

[Kelli Hoyt]

Hi Jonathan,

In case you were still working with/looking at Zen, I neglected to mention the following workaround which may or may not be helpful:

Insert the full-width macro in the Header of any space where you'd like the full-width view. If you want full-width across all spaces, make sure they are all using the same header with that macro inserted (look in your Zen space settings for this), or, just make sure that macro is inserted in any header used by your spaces.

cheers,
Kelli

[Jonathan Simonoff]

Thanks Kelli. We may end up doing that, although I'm not sure. I don't like the price of giving up the page tree. (We're on 5.1 now, so no page tree in the default sidebar. It may be we're going to upgrade, and I could use that sidebar with a page tree instead of the Zen one).

[Kelli Hoyt]

Oh great - and sorry I didn't provide the link for you! http://www.brikit.com/display/themepress/Brikit+Theme+Press

Glad you were able to find it, though!

cheers,

Kelli

[Jonathan Simonoff]

Hi, Kelli,

What I want, ideally, is the stretchy/full-window-width behavior in user mode with side columns showing. Thanks!

Jonathan

[Kelli Hoyt]

Hi Jonathan,

When you say, "when the user makes the page wider" can you tell me more about that? Do you mean the designer using the Brand Designer? Or just a user who is working on a page branded with your theme?

In other words, are you looking for a theme that:

• uses stretchy/full-window width on only some pages?

or

• is always stretchy/full-window-width?

Thanks!

- Kelli

[Kelli Hoyt]

Hi Jonathan,

When you say, "when the user makes the page wider" can you tell me more about that? Do you mean the designer using the Brand Designer? Or just a user who is working on a page branded with your theme?

In other words, are you looking for a theme that:

• uses stretchy/full-window width on only some pages?

or

• is always stretchy/full-window-width?

Thanks!

- Kelli