The HTML page structure is determined by the page template specified by html.template.page application property. The default page template is AjaxSwing/conf/templates/default-page/page.html. If you want to customize the page template, it is highly recommended to copy all files from default-page directory to custom-page directory to simplify future upgrades. It is important to keep all elemenents in the page template and their order. Most of the times you would probably want to add your custom HTML code to body-header.html and body-footer.html. Those fragments are included into the page template before and after the Swing screen container with id=AjaxSwingScreen. Note that you would probably change the style attributes such as left, top, width and height of the AjaxSwingScreen DIV element to accomodate the HTML elements you are adding. The location and size of AjaxSwingScreen DIV element is used as the screen size for virtual Swing graphics environment.
When AjaxSwing renders a Swing component, it uses renderers to generate a corresponding HTML elements. For example, a JTextField is represented by <INPUT type="text"> HTML element, and each container is represented with a <DIV> element. For all logical components AjaxSwing defines corresponding CSS class. Thus, the job of customization becomes finding the right stylesheet and redefining the styles to make the page look the way you want it. AjaxSwing themes are implemented with CSS styles and images. Customizing the stylesheet is the easiest and the best way to achieve "company look and feel" where you will make AjaxSwing application follow the guidelines for colors and fonts established by your company.
The best way to familiarize yourself with the generated HTML is to run SwingSet2 and look at the source
page using browser's View Source option. You will see in the page header that each page includes a link similar to the one below
<link rel=stylesheet href="http://creamtec.com/ajaxswing/Light_docs/css/ajaxswing/styles_common.css">
The specific directory and the file name is determined by HTML theme specified in the application properties file. All standard AjaxSwing styles are defined in styles_common.css, and if you open it you would see styles such as window, label, button, errorMessage and others. styles_common.css is included in all pages.
The cleanest place for custom style definitions and overrides is css/custom.css. This file is included after all default stylesheets allowing you to isolate your changes and making future upgrades easier.