In WebGUI as we know it now, asset templates define two distinct aspects of an asset's appearance: the functional components of the asset output and some form of visual wrapper that separates it from the rest of the page. (The latter is optional.) There have been many times when I have wished these two could be separated -- that there was the option for a "wrapper" or "frame" template that could be applied between the asset template and the page layout template. After hearing JT's plan for development of WG 8 at the WUC last week, it seems this might be a good time to bring up my ideas. I'm curious whether other people would find this sort of functionality useful. I'm also curious whether people think the added functionality would be worth increasing the complexity of the display tab on all assets.

A personal example:

On the sites that I manage, we often use a rounded-corner box to separate things on the page, and the template for this is rather complex because it uses metadata to allow content managers to vary color, size and a number of other aspects of the box. We have used this particular box on articles, folders, SQL reports, and navigations, and each time I go to set up a template in a new asset, I have to copy the template code over. For complex templates such as multi-query SQL reports and deep navigation menus, this can lead to some very complex and difficult to edit templates! With a separate "frame" template that could be applied to an asset, you could develop asset templates that focus on the asset's output and controls, making the templates simpler and easier to debug. And there would only be one frame template for a particular border type.

Also, I am not completely happy with the rounded-corner template, which uses tables for some aspects of image positioning that I couldn't find a better cross-browser solution for at the time. Should I come up with a better solution some day, I'd have to apply the fix to each asset template that uses the older code. With a "frame" template concept, there would only be one template that I'd need to update.

Alternate solutions:

When I've been too lazy or too busy to create a rounded-corner template for a new asset, I have simply placed the asset in an article using the rounded-corner template. It works fine, but it creates two assets where only one should be necessary, and it's a bit too complex for our average content managers to implement.

You could also achieve a similar effect by placing the wrapper code in snippets, one for the bit that goes before the asset template code and one for the bits that go after. But this can also get complex and requires that you manage two files to ensure all tags opened eventually get closed.

My Suggestion:

1. Add a frame/wrapper template option on each asset's "display" tab, after the printable style template and before the asset template. Unlike other template settings, this new template would have "none" as an option.
2. The nature of the frame/wrapper templates would be quite simple at the basic level: there is code that creates the visual container on the web page, and a single template variable that says "insert asset here".
   
3. In the site settings, add a "use frame/wrapper templates" option so that people who don't wish to add this level of complexity to their site don't have to.

There would be some additional complexities, such as determining which template variables would be available to this outer template, but for now, I'd like to know whether this concept in general is something other people would like to see implemented. If it is, 8.0 would seem to be a good place to start.

Thanks for the responses. It sounds like our particular templating needs are not shared with enough other users to warrant such a change to WebGUI.

Colin:

We need the ability to modify individual articles on a page, so the page layout templates wouldn't work. We need the ability to say that this article should be a different color (and possibly a different borer) because it's new and most important.

Also, the way I envision the frame/wrapper templates working, it would not be difficult to manage, because they would be asset-agnostic. Just as you have a "style" that is a wrapper that can be placed around any asset viewed on its own (and which is asset-agnostic), this frame/wrapper template would simply be a batch of code placed around an asset when viewed within a page layout.

JT:

I'd love to do more with the CSS Zen Garden approach, but the demands of our designers and communications office require more complex code than I think a CSS-only solution would provide. I need the ability to tweak asset widths, colors and border styles on demand, without having to go back to a graphics editor to come up with new images with each change. This means that if you want a border with anything other than rectangular corners, you have to place a graphic in each of the four corners to give flexibility in width. With a solid color background, you can do this in CSS without JavaScript, but the most robust cross-broswer solution involves 4 nested divs with a corner as a background image in each.

For the rounded corner outline that has variable color, the graphics can't be background images, but need to be placed as images in the corners of the container. (The variable color is achieved by using corner images consisting of a transparent arc of pixels, and giving the img tag a background color set with CSS.) I can't think of a way you could achieve this with pure CSS in a way that wouldn't require copying all the components to each asset template that wanted to use this technique.

Henry:

Your suggestion sounds like it's the best alternative to what we already do, if jquery can modify the DOM and add complex wrappers around existing content on the page. It seems a bit heavy-handed for our needs, but since we use these types of graphic containers a lot on our site, it might be worth looking into. I find jquery's syntax confusing and counter-intuitive compared to how I've used JavaScript in the past, and I've not yet encountered a project that needed it enough to justify taking the time to learn it. Your suggestion just might be what gets me to finally learn jquery.

Further discussion on this topic is probably better directed over to the design forum. For those of you who may be curious about the templates I've been describing, here's a good example page that includes several varieties:

http://www.law.umn.edu/current/index.html

I'd also be happy to hear suggestions in private.