Forum OpenACS Q&A: templating question - spanning <grid> items across table rows

I'm trying to work out how to do something in the templating system, and it's got me pretty much stumped...

The layout we're trying to achieve is something like this -


+--------------+-------------+
| thumbnail 1  | thumbnail 2 |
+--------------+-------------+
| text related | item 2 text |
| to item 1    |             |
+--------------+-------------+
| thumbnail 3  | thumbnail 4 |
+--------------+-------------+
| item 3 text  | item 4 text |
+--------------+-------------+

The thumbnails and their associated descriptive text need to go in seperate <tr>s to achieve the desired layout, but I have no idea how to do this using <grid>, or if it is possible at all...

can anybody shed any light?

This would work:

multirow create thumbnails item

multirow append thumbnails {<img src="image1">}
multirow append thumbnails {<img src="image2">}
multirow append thumbnails "Image 1 text"
multirow append thumbnails "Image 2 text"

multirow append thumbnails {<img src="image3">}
multirow append thumbnails {<img src="image4">}
multirow append thumbnails "Image 3 text"
multirow append thumbnails "Image 4 text"

Then:

<table>
<grid name=thumbnails cols=2 orientation=horizontal>
    <if @thumbnails.col@ eq 1>
        <tr valign=top>
    </if>

    <if @thumbnails.rownum@ le @thumbnails:rowcount@>
        <td>@thumbnails.item@</td>
    </if>

    <if @thumbnails.col@ eq 2>
        </tr>
    </if>
</grid>
</table>

Note the weird ordering in the creation of the multirow.  Or, you could remove the "orientation=horizontal" from the <grid> tag and order the multirow like this (might be weirder still):

multirow append thumbnails {<img src="image1">}
multirow append thumbnails "Image 1 text"
multirow append thumbnails {<img src="image3">}
multirow append thumbnails "Image 3 text"

multirow append thumbnails {<img src="image2">}
multirow append thumbnails "Image 2 text"
multirow append thumbnails {<img src="image4">}
multirow append thumbnails "Image 4 text"

Maybe there's a better way, but the above should definitely work.  Good luck...

Collapse
Posted by Ben Koot on
My new index page looks like this...  http://www.timedesk.nl/ Can anybody tell me how I can replace the left section content with Lars-blogger. I assume many more folks have similar questions. It might be an idea to have a little tutorial to make these kind of changes. A kind of customisation Howto.

I checked the CCS information in the OACS docs, but can't make head or tails from them. No offence to the folks that created them, but I am not a developper. I just wan't to integrate a part of the toolkit into an html page I created.

Yhanks for any tips

Ben