Best way to design/edit multi-column layouts

I hope this is the right place to post this.

I am currently converting a template to port my own site over to MODx. My design makes use of split columns within the content area contained, as you would expect, inside DIVs. I.e. the design might be left sidebar and content area where the content area can have 1, 2 or 3 column formatted text as required. TinyMCE seems incapable of handling DIVs and I have no idea how it would handle multi-column text so what is the best way to proceed?

The simplest is to edit the raw html, or to edit the pages outside MODx and incorporate them by the php include(’...’) trick but these don’t exploit much of the power of MODx.

Another option is to have each column’s content as a separate chunk but that gives me a naming and management nightmare, not to mention extra database overhead in fetching multiple pieces (obviously less of an issue with cacheing). A bonus is that I get WYSIWYG editing of the content of chunks though without the benefit of CSS inheritance from e.g. parent divs.

I don’t even want to think about the difficulties of e.g. going from a 2 column layout to a 3 column layout.

I know MODx can’t do everything but multi-column layouts seems like a common situation.

So do I have any other options?
Is there a more suitable editor?
What are other people doing?

Ed

There is no reason why you cannot do as you say. Your template will have the main layout blocks. Then in your content put whatever layout you want for the main content. It’s all in the CSS, as you already know. MODx puts no barriers whatsoever in the way of making any kind of layout you want.

Quote from: sottwell at Oct 02, 2006, 02:56 AM

There is no reason why you cannot do as you say. Your template will have the main layout blocks. Then in your content put whatever layout you want for the main content. It’s all in the CSS, as you already know. MODx puts no barriers whatsoever in the way of making any kind of layout you want.

My query was kind of wooly, let me try again.

I have no problem creating a template embodying my layout, say sidebar then main content area with e.g. 1 column preamble, 2 column mid section, 1 column postamble. Trouble is that a template only has a single [*content*] tag which is the bit that TinyMCE lets you edit, so in order to realise my design it seems I need a separately editable element for each page element, say sidebar, row1, row2col1, row2col2, row3, it also seems that these must be TVs which makes the page creation and editing very unWYSIWYG.

What don’t I understand? is there a way to do WYSIWYG editing of my design with TinyMCE?, what does TinyMCE do if there is no [*content*] placeholder?. Obviously the answers will influence how I design my templates.

Ed

it also seems that these must be TVs which makes the page creation and editing very unWYSIWYG.

If you set the TV type to ’Richtext’ when you create the TV then you will get the WYSIWYG editor loaded for that TV when you are editing your document. (just the same as for the main content area)

I haven’t read every post in here yet... but I’ve been struggling with creating (and effectively using) a 3-Column layout so far. Is it of the opinion of those more advanced that the best way to do this is to create a template with a single "container" for [*content*] ... then use TV’s, Chunks and/or Snippets to hold the actual <div> tags?

In my mind it would look something like this:



Then I could either build the <div> tags, id’s, and classess in the RTE... and/or create Chunks or Snippets to include within the content area that might assist in keeping creating the structure. And I further presume that if I yet understood (do to lack of time) how to implement TV’s I could then automate the "structure" even more.

Is this the right path? Am I missing something? Is it better to build the whole template (as a template, with 2 or 3 columns, etc.) and only use static or Snippets (such as Wayfinder or DropMenu) which have parameters that can assist in making those areas outside of [*content*] appear or be more dynamic?

I’ve got a basic 3-column template (actually a number of them) called Animetor that I originally worked up for somebody else; I used the same template with a different CSS file for my October Pink template on the home page of loripsum.co.uk. Is that the kind of thing you mean?

http://www.loripsum.co.uk/