Portlet Factory, Version 6.1.2
Page Automation HTML templates
The Data Page builder, along with the other builders that use Data Page, can automatically generate HTML for displayed pages. You can control the look and feel of the generated HTML by using Page Automation HTML Templates.
There is a default template, of course, and it is highly useful for rapid prototyping and simple pages. However, if you want to achieve an exact look and feel in your generated pages, you can provide your own HTML template. This approach allows you to format multiple application pages with little or no hand-crafting.
When to use an HTML template?
The amount of control you want to exert over the look of the application varies, depending on your needs and choices. In some cases, auto-generated HTML will be adequate for your needs. In other cases, you might want a more sophisticated look and feel for your pages than what is available by default from the page automation system.
In general, you have several options to choose from when it comes to page formatting:
- Let system determine page look and feel
- You can use Data Page and its associated builders to generate all the HTML needed for an application. This insulates you completely from changes and ensures that, if the data driving your application changes, your pages will reflect the changes automatically.
- Create a base page and stylesheet
- If you want your own look and feel you can add a base HTML page and a style sheet to get some control over the way that page looks. Used in conjunction with Data Modifiers, this will give you control over many of the elements on your page.
- Hard code HTML tags
- If you want complete control over the look of the application you can also hard code individual tag names into an HTML page to control the display of all items on the page. This approach can be tedious and you can end up tied to the underlying data. In addition, you are not taking advantage of the Data Page builder's page generation capabilities.
- Use an HTML Template
- This approach represents a great middle ground and provides two major advantages: HTML Templates offer you a lot of control over individual page elements and HTML Templates also allow you to exploit the Data Page builder's ability generate the bulk of the HTML code.
Benefits provided by an HTML template
The HTML template files provide instructions to the page automation builders and allows you to control the automatic generation of HTML. This control greatly reduces the need to hand-craft the look and feel of each individual page. To create your own HTML template, you make a copy of one of the master templates that come with the product and edit it to get the effects you want.
You can use one HTML template for all pages in an application to achieve a consistent look and feel or you may use different templates for different pages or sets of pages. HTML templates are used in conjunction with imported pages (Imported Page builder) which provide content layout, graphics and non-generated artifacts. They may also be used with style sheets as desired.
Parent topic: Overview: creating pages
- HTMLWRAPPER tags
The HTML templates provided by IBM WebSphere Portlet Factory include <HTMLWRAPPER/> tags around some of the markup.
- About invoking an HTML template
The default theme for a project provides a convenient way for you to specify HTML template files in your application.
- Adding elements to a template
Sometimes you will want to use additional builders which will operate on HTML generated by the Page Automation code.
- Alternating styles (and classes) for table rows
Often, in creating an HTML table, you want to have alternating styles for the rows to make the table easier to read.
- Auto-generated HTML template structure and constructs
Pages generated by the Data Page builder have a common structure that is based on constructs.
- HTML template files and example models available
The HTML template files and their matching style sheets are located in the directory, factory\html_templates. Available HTML templates include the following.
- Construct names and their inner elements
This topic describes all the fundamental construct names and the named XML elements that are valid within each construct in page automation templates.
- Page automation example: adding spacer rows to a table
By changing only the template, you can add spacer rows anywhere in a table: before the header, between the header and the data, before or after each data row, and after the entire table.
- Page automation example: changing page layout based on control type
Often you will want to change the layout for a field based on the control type. The most common situation is that you want any field which is edited using a textarea get the entire width of the screen for the textarea, even though the other fields are using only the right-hand portion for their edit devices.
- Page automation example: editing an HTML page automation template
The following HTML represents a master template that has been modified (note comment sections) to achieve various display results.
- Imported Page builder
The Imported Page builder adds an existing HTML or JSP page to the current model.
Library | Support |