Template Object Model:
Introduction to Template Customization
and Branding Leverage Theory
In the original implementation of VBM (up to release 4) HTML code was created on-the-fly for each customer by large, complex C code processes. The HTML was broken up into small sections and distributed through a dozen sections of code for each page. This made it very difficult to change layout of the page, or even the formatting of a small part of it.
On the other hand, through changes to the configuration it was possible to make changes across every page with only a few keystrokes for a few special cases; very powerful. The difficulty was we could not anticipate all the possible changes (including frames, javascript, etc.) to the screen designs, and if we could, there would be no possible way to construct a feasible code-based configuration layer to actually provide this function.
The New Era: the VFM5 Template Object Model
In VFM5, TOM allows considerable control over the appearance of the UI with no template code changes, using only CSS edits and image substitutions. Larger changes to shared code objects can alter the location and layout of identity, footers, site navigation, and even product navigation.
By breaking the templates into hierarchical structures with shared sections, common objects like headers and footers can be structurally altered with minimal file editing. Since almost all FI's will have more expertise and desire for graphics and navigation 'styling' rather than wanting widespread form process changes, the hierarchical layout provides leverage for more easily implementing those kind of customizations.
Finally, the individual form templates can be edited to alter on-screen help, language, and even some processing. Here are a few mockups built on the new model which show some simple examples of the ladder of changes available through TOM.
SoftOps Index
SoftOps Org Charts
Architecture
ID+B
Boston Technology Group
QA
Support Services
Technical Publications
Tools and References
Product Management Index
Branding Scenarios are high-level descriptions of branding requests and which template objects to modify to make the changes. These are not step-by-step checklists, but general discussions for where to begin.
Reference: Standard Template Positioning
- Edit id_nav_*.tmpl templates and images to act as headers for navigation
- Edit nav_*.tmpl templates and images to change shape of table and add align=top argument to <table> tag
- Remove content from id_footer.tmpl
- Add content to id_nav_footer.tmpl
- Edit CSS file to make form classes same background as class=bkgnd
- Replace id_form_curve*.gif corner images with clear GIFs
Remove Alternating Rowcolor look from Tables:
- Edit CSS file to make class=*grey classes match class=*
- Edit id_footer.tmpl file to close open form table, start new table for footer in same file with align=bottom in <table> tag
Copyright © 1997 - 1998, S1. All rights reserved. Created by S1
iWeb Main
General Info & Admin
CustomerOps
Sales & Marketing
SoftwareOps
Org Charts
Domino
S1 Index
S1 (external)
SFNB
SFNB (external)