Pure XHTML Output Template à la csszengarden.com (Request)

Hi everyone!

I haven’t found a pure XHTML Template yet, with the only purpose to give the Designers a base to do their work only with CSS. I hate messing around with the template and I would love to have a given XHTML Output, something like at csszengarden.com . There, the designers don’t have to care about the XHTML. They only have to work with the CSS File.

So, all the XHTML Cracks, it would be great if you could create such a XHTML template which gives the CSS designers as much possibilities as possible. This means many <div> tags like at csszengarden, then <span> tags inside the <div> tags to give more freedom.

I think you can imagine what i’m trying to explain?

Such a template would be a great advantage, as a included template in the modX package too, to help the users to simply get a valid XHTML output without too much hassle.

Greetings,
Thiemo

What you mean is, we provide an xhtml template which you can skin with CSS to your liking ?

You already have one in the default distribution : Minimal Template is valid XHTML 1.0 Transitionnal

You could also use xhtml template from the web : it’s not specific to MODx... MODx templates are basically xhtml templates with MODx tags embedded (see the documentation about this).

I don’t know if it answers your question...

http://modxcms.com/forums/index.php/topic,988.0.html

Look at this:

http://www.highresolution.info/webdesign/yaml/
http://www.contentwithstyle.co.uk/Articles/12/modular-css/

It would be great if somebody make a teplate with this coding conventions

Many if not most of the templates here do so.

You can copy/paste the "yaml" .html file directly into the MODx template textarea, put the "yaml" folder into assets/templates, change the paths in the template to assets/templates/yaml... and you will get the yaml page. Simply start replacing the content in the template with MODx tags. For example in div col3 replace the content with [*content*]. Replace the menu ULs with [[DropMenu]] with the appropriate arguments.

Personally, I prefer this http://www.positioniseverything.net/ordered-floats.html since you can specifically put your main content in the first column in the source, then position it wherever you want it. Of course, you’ll get to play "musical browsers" with the various browsers’ buggy box model and float model implementation.

About modular css : nice link, indeed that’s the way I work personnally without knowing that it was called that. MODx makes this even easier (you don’t even need @import rules) if you use a MODx document with text/css content-type as stylesheet.

Instead, you use... chunks with CSS content that you divide into typography styles, form elements, main layout, navigation, colour...

Quote from: davidm at Jan 28, 2006, 07:39 AM

MODx makes this even easier (you don’t even need @import rules) if you use a MODx document with text/css content-type as stylesheet.

Instead, you use... chunks with CSS content that you divide into typography styles, form elements, main layout, navigation, colour...

And TVs or snippets for variable styling! How about orange stuff if the user isn’t logged in and green if he is? Or different background images for the header for different pages or different sections of the site?

Quote from: sottwell at Jan 28, 2006, 07:42 AM

And TVs or snippets for variable styling! How about orange stuff if the user isn’t logged in and green if he is? Or different background images for the header for different pages or different sections of the site?

Would be nice yes !
TVs : haven’t explored that alley yet...
Snippets : yeah well since I can’t code I’ll wait for those server side CSS snippets

The recenty added Brown template uses TVs to control the background images used in the header.

http://modxcms.com/forums/index.php/topic,2596.0.html