xhtml code in templates

Author Message

Mikhail Chekanov

Wednesday 17 March 2004 6:50:15 am

I have a suggestion related to xhtml code in templates. It's simple, but...
Look, ez team is going to replace nested tables with nested divs and this way we can control all design-related stuff through CSS. But every package (including admin and standart) has different selectors, id's, etc.
The general idea is to standardize xhtml code within eZ by separating the layout from the design once again. :D
For example for article view:
<div id="content">
<div class="article">
<h3>Header goes here</h3>
<div class="intro">Intro</div>
<div class="body">
<img>
<p>Body text</p>
</div>
</div>
<div class="comments">
<div class="author">Author info</div>
<div class="body">Hello world!</div>
</div>
<div class="comments">
<div class="author">Author 2 info</div>
<div class="body">Hello 2 world!</div>
</div>
</div>
And for dinamic objects like sidebar tree menu:
<div id="sidebar">
<ul>
<li id="active" class="folder">News</li>
<ul>
<li id="active" class"folder">IT</li>
<li class="folder">Sport</li>
</ul>
<li class="infopage">About</li>
<li class="form">Contact us</li>
</ul>
</div>
So, as you can see, I've used unique IDs for the layout/logic and non-unique CLASSes to describe type of objects and their attributes.
H3 for article header was used because it is simple attribute, article body is more complicated (XML field with other tags) - so i've used div for it.
And, finally, for the stylesheet:

#content {float:right;}
#sidebar {float:left;}

#content div.article {background:#fff;}
.article h3 {font-size:120%;}
#sidebar li#active {font-weight:700;color:red;}

This looks complicated, but with weel-formed rules for template xtml code (eZ team already have written rules for PHP and TPL coding) we can gain control over design-related stuff only with CSS stylesheets.
Advantages: simple theming; quick redesign; clear xhtml structure.

--
mike
#6595551

Alex Jones

Wednesday 17 March 2004 7:40:10 am

The eZ team is moving in this direction. Check out the article discussing the new Admin interface (http://ez.no/community/news/the_administration_interface_project) which touches upon the subject of XHTML and CSS usage. There is also a related thread (http://ez.no/community/forum/suggestions/the_administration_interface_project) discussing that article.

Better use of CSS/XHTML is important moving into the future.

Oh, on a side note, I would recommend dropping the term 'sidebar' as it implies placement on the page. IDs and Class names shouldn't imply placement, or for that matter style (like color, font-weight etc.) as future redesigns may not place that object in the same spot, or may choose to use a different method of styling. For example, I may choose to move the contents in the 'sidebar' to display at the top of the page. Perhaps a better term would be along the lines of 'sitemenu'; describing its contents instead of its placement.

Alex

Alex
[ bald_technologist on the IRC channel (irc.freenode.net): #eZpublish ]

<i>When in doubt, clear the cache.</i>

Mikhail Chekanov

Thursday 18 March 2004 1:38:06 am

>...Check out the article discussing the new Admin interface
>...There is also a related thread...
Yes, i've read it - my post was inspired by the article

>...Oh, on a side note, I would recommend dropping the term 'sidebar' as it implies placement on the page...
yea, it implies "sidebar tree menu", not placement :) It can be placed anywhere - within left/right sidebar block, main area and so on.

--
mike
#6595551

Alex Jones

Thursday 18 March 2004 7:16:43 am

A valid point. Ultimately the name of 'sidebar' tree menu should be changed as well then. Separation of content and display (naming conventions included) should be reflected throughout the system.

Alex

Alex
[ bald_technologist on the IRC channel (irc.freenode.net): #eZpublish ]

<i>When in doubt, clear the cache.</i>

Powered by eZ Publish™ CMS Open Source Web Content Management. Copyright © 1999-2014 eZ Systems AS (except where otherwise noted). All rights reserved.

eZ debug

Timing: Jan 18 2025 15:13:31
Script start
Timing: Jan 18 2025 15:13:31
Module start 'layout'
Timing: Jan 18 2025 15:13:31
Module start 'content'
Timing: Jan 18 2025 15:13:32
Module end 'content'
Timing: Jan 18 2025 15:13:32
Script end

Main resources:

Total runtime0.9439 sec
Peak memory usage4,096.0000 KB
Database Queries60

Timing points:

CheckpointStart (sec)Duration (sec)Memory at start (KB)Memory used (KB)
Script start 0.00000.0059 587.9063152.6250
Module start 'layout' 0.00590.0026 740.531339.4453
Module start 'content' 0.00850.9338 779.9766558.6719
Module end 'content' 0.94230.0015 1,338.648416.1719
Script end 0.9438  1,354.8203 

Time accumulators:

 Accumulator Duration (sec) Duration (%) Count Average (sec)
Ini load
Load cache0.00280.2962160.0002
Check MTime0.00120.1278160.0001
Mysql Total
Database connection0.00070.077210.0007
Mysqli_queries0.888594.1387600.0148
Looping result0.00050.0561580.0000
Template Total0.916597.120.4583
Template load0.00180.194820.0009
Template processing0.914796.905620.4573
Template load and register function0.00010.013410.0001
states
state_id_array0.00100.108710.0010
state_identifier_array0.00170.184220.0009
Override
Cache load0.00160.1723630.0000
Sytem overhead
Fetch class attribute can translate value0.00050.054920.0003
Fetch class attribute name0.00090.090850.0002
XML
Image XML parsing0.00070.071120.0003
class_abstraction
Instantiating content class attribute0.00000.001760.0000
General
dbfile0.00070.0723160.0000
String conversion0.00000.000740.0000
Note: percentages do not add up to 100% because some accumulators overlap

Templates used to render the page:

UsageRequested templateTemplateTemplate loadedEditOverride
1node/view/full.tplfull/forum_topic.tplextension/sevenx/design/simple/override/templates/full/forum_topic.tplEdit templateOverride template
4content/datatype/view/ezxmltext.tpl<No override>extension/community_design/design/suncana/templates/content/datatype/view/ezxmltext.tplEdit templateOverride template
6content/datatype/view/ezxmltags/line.tpl<No override>design/standard/templates/content/datatype/view/ezxmltags/line.tplEdit templateOverride template
8content/datatype/view/ezxmltags/paragraph.tpl<No override>extension/ezwebin/design/ezwebin/templates/content/datatype/view/ezxmltags/paragraph.tplEdit templateOverride template
2content/datatype/view/ezimage.tpl<No override>extension/sevenx/design/simple/templates/content/datatype/view/ezimage.tplEdit templateOverride template
1print_pagelayout.tpl<No override>extension/community/design/community/templates/print_pagelayout.tplEdit templateOverride template
 Number of times templates used: 22
 Number of unique templates used: 6

Time used to render debug report: 0.0002 secs