The question is to transform a definition list output by upm_date_menu
plugin into table like this seen on the bottom of this page. Here is the source of upm_date_menu
output (shamelessly borrowed from mistersugar.com/archive, sorry), that we save in some variable, say “archive”:
<txp:variable name="archive">
<dl>
<dt>2012</dt>
<dd><a href="http://mistersugar.com/article/2012-01">Jan</a></dd>
<dd><a href="http://mistersugar.com/article/2012-02">Feb</a></dd>
...
<dt>2011</dt>
<dd><a href="http://mistersugar.com/article/2011-01">Jan</a></dd>
...
</dl>
</txp:variable>
Our aim is to transform dt
into th
and dd
into td
, then display them in the “horizontal” order:
<txp:etc_query data='<txp:variable name="archive" />'
query="dl" parse="before" wraptag="table">
<thead><tr>{dt&=<th>{node()}</th>}</tr></thead>
<txp:etc_query data="[1..12]" wraptag="tbody" break="tr">
{{dt/following-sibling::dd[{?}]&=<td>{{node()}}</td>}}
</txp:etc_query>
</txp:etc_query>
The internal etc_query
is there to generate twelve table row templates, one for each month. Once preparsed (hence parse="before"
), it will produce
<tbody>
<tr>{dt/following-sibling::dd[1]&=<td>{node()}</td>}</tr>
...
<tr>{dt/following-sibling::dd[12]&=<td>{node()}</td>}</tr>
</tbody>
inside the external etc_query
. We could safely replace it with this block, but it nicely illustrates the nesting syntax of etc_query
.
Finally, the instruction {dt&=<th>{node()}</th>}
will put the content of each dt
inside a <th>...</th>
tag, and {dt/following-sibling::dd[1]&=<td>{node()}</td>}
will match every first dd
following some dt
, i.e. all January links, and put its content inside <td>...</td>
. The second row regroups all February links, and so on. And here is the result:
2012 2011 2010 2009 2008 2007 2006 2005 2004 2003 2002 2001 2000 1999 1994 Jan Jan Jan Jan Jan Jan Jan Jan Jan Jan Jan Jan Jan Jan Jan Feb Feb Feb Feb Feb Feb Feb Feb Feb Feb Feb Feb Feb Feb Feb Mar Mar Mar Mar Mar Mar Mar Mar Mar Mar Mar Mar Mar Mar Mar Apr Apr Apr Apr Apr Apr Apr Apr Apr Apr Apr Apr Apr Apr Apr May May May May May May May May May May May May May May May Jun Jun Jun Jun Jun Jun Jun Jun Jun Jun Jun Jun Jun Jun Jun Jul Jul Jul Jul Jul Jul Jul Jul Jul Jul Jul Jul Jul Jul Jul Aug Aug Aug Aug Aug Aug Aug Aug Aug Aug Aug Aug Aug Aug Aug Sep Sep Sep Sep Sep Sep Sep Sep Sep Sep Sep Sep Sep Sep Sep Oct Oct Oct Oct Oct Oct Oct Oct Oct Oct Oct Oct Oct Oct Oct Nov Nov Nov Nov Nov Nov Nov Nov Nov Nov Nov Nov Nov Nov Nov Dec Dec Dec Dec Dec Dec Dec Dec Dec Dec Dec Dec Dec Dec Dec
If you have many articles, you may consider wrapping the output of both upm_date_archive
and etc_query
into etc_cache
for better performance.
An even better option will be to use CSS2 display:table(-row|-cell)
properties, rather than node transformation:
<txp:etc_query data='<txp:variable name="archive" />'
query="dl" parse="before" wraptag="dl">
<div>{dt}</div>
<txp:etc_query data="[1..12]">
<div>{{dt/following-sibling::dd[{?}]}}</div>
</txp:etc_query>
</txp:etc_query>
<style>
dl{display:table}
dl>div{display:table-row}
dt,dd{display:table-cell}
</style>
File(s)
- File: etc_query.txt [60.72 kB] (4256 downloads, ~29 per month)