TV's for varying page layouts

Hello,

Am completely unfamiliar with Template Variables (and new to ModX in general, though not completely lost).

Have been told that Template Variables are the way I should approach varying page layouts with multi-column content regions (boxes). Have read and re-read the online TV documentation, such as here:
http://rtfm.modx.com/display/revolution20/Template+Variables
but am having trouble understanding how to accomplish what I require.

There are varying page layouts, all validating HTML5 and CSS2 and 3, all displaying virtually identically across 18 browsers on 4 platforms.

They are all based on a basic outer template. Each layout’s inner content container will contain varying sections consisting of 1, 2 or 3 columns. For example, in the attached PNG of an inner content container there are three sections:

• the top one is a single column section/content region classed, "single";
• the middle one is a 2-column section classed, "duet" containing 2 articles/content regions, and;
• the bottom one is a 3-column section classed, "triad" containing 3 articles/content regions.

Have created a template for this page layout variation, have created a page in the ModX manager to test the template, but don’t know how to create the TV that delineates the content regions as empty fields, ready for content, and un-destroyable by the WYSIWYG editor (TinyMCE) which strips my vaildating, legal HTML5 elements (sections and articles) from my HTML.

Can anyone give me a brief step-by-step or point me to one that isn’t completely self-referential and vague? One that I can follow to create all of my different layout TVs? Or, is this the wrong way to approach this?

Many thanks in advance,
Leigh

Could you give us a little more detail on how the site is going to be used? You may be able to use getResources instead of TVs.

Hey AMD,

Thanks for getting back to me.

The site is a complex CMS and web portal, but these particular templates are for the public-facing site. The client (who will find even the TinyMCE WYSIWYG editor to be too technical) will be adding new pages and editing content of existing pages based on these templates. So, I require a way for the WYSIWYG editor to display the content regions so that the client can simply enter their content (including images, headers, links, lists, tables, etc.) into the appropriate region, click save and the structure of the page remain in tact. Did that help clarify?

Thank you, again,
Leigh

Quote from: AMDbuilder at Jun 10, 2011, 01:57 AM

Could you give us a little more detail on how the site is going to be used? You may be able to use getResources instead of TVs.

That helps a little, granted my question was geared a touch more towards, will the content for those fields be related to other pages?

So, would the full width item come from say a "news" category and always showcase the latest post? Basically can we automate any of these fields?

AMD,

Oh, now I understand! No, there won’t be persistently included content for the most part, though there will be a few of those, so when that time comes, I’ll be certain to hit you up!

Actually, these are for web pages that will be continually edited by the client, the nature of whose work necessitates this frequent updating, which is why it’s essential that:
a) the template’s unique page structure be stable and remain unmolested by the WYSIWYG editor’s "helpful" HTML stripping, and;
b) the content regions be clearly defined and indestructible structurally but content-editable by the client’s site maintainers.

Please let me know if I’m not being clear enough?

Much gratitude,
Leigh

Quote from: AMDbuilder at Jun 10, 2011, 02:09 AM

That helps a little, granted my question was geared a touch more towards, will the content for those fields be related to other pages?
So, would the full width item come from say a "news" category and always showcase the latest post? Basically can we automate any of these fields?

This is going to be using Revolution?

If may be easier to discuss this a little further on Skype (skytoasterllc) if you have it. I may have a few ideas for you, but give me a little to check/confirm things.

Thanks,
Patrick R.

Dear Patrick,

I’m not set up for Skype at the moment, but can ring you if you have a Skype number. I can also download an IM program, if necessary. And, thank you so much for the kindness.

Much gratitude,
Leigh

Okay, it looks like TV’s are DEFINITELY not the way to go to get multiple content regions in a template. Thanks for your time and attention, Patrick. If anyone else has any ideas about how to achieve this in ModX, I’d love to hear about it.

Much gratitude,
Leigh

Having a truly WYSIWYG rich text editor with defined content areas has never been something I could successfully implement.

I almost always resort to custom tables preloaded into TinyMCE on document creation and style them such that they are structural only and invisible in the front-end, while in the back-end they appear as dotted guides. Tables work well because Tiny is comfortable with them, as opposed to divs and other structural markup that Tiny tends to clobber.

Mike

Dear Mike,

Thank you for getting back to me.

"Clobber" is the perfect word. Sorry but relieved to hear that tables are a good fall-back position for multiple content regions, if you know what I mean.

Over on their forums, TinyMCE people mentioned 2 settings that I can’t find in my ModX Revo System Settings: "Valid Elements" and "Valid Children" where, apparently, you can add elements in a comma-separated list to force TinyMCE to play nice with HTML5 (and other) elements. When I mentioned I couldn’t find it over there, I was told to look for the tinyMCE.init but haven’t a clue where else to look. Have you?

Many thanks, again,
Leigh