Creating and modifying classic WebFacing styles

To create a new style in WebFacing you must have a project with a supplied WebFacing style, which is a standard, uncustomized style. Modifications to the style are based on the selected style and apply only to the current project. To save the style, right-click your project and select Style > Save as and give the style a name. Once you have created a user-defined style, you can save subsequent modifications to the same style name. This style then becomes available for selection the next time you choose a Web style during project creation or the next time you select a style to replace the current project style. To replace a style, right-click your project and choose Style > Select Style. To see the directory structure for the location of a style within your project, select the Navigator tab. In the Navigator view, the path to the styles directory for a project is <project_name>\WebContent\webfacing\styles.

If you want to edit the style that is used for the application area and command key elements, edit the apparea.css file in the \apparea directory using the Style properties page or directly using tools supplied in the IDE. The Style properties pages make it easier to visualize the modifications that are being made and show you how these changes apply to the DDS elements such as window and subfile records. The changes made through the Style properties pages are then applied to the corresponding style class names in the apparea.css file. Note that not all style characteristics can be modified with the WebFacing properties pages. To use the IDE's CSS editor, right-click the file that you want to edit and select Open With > CSS Designer.

Properties for styles are stored in two separate directories of the styles folder inside the WebFacing project:
Files that can be edited for style changes Directory where files are stored Part of Web page they apply to Editable using properties pages?
  • apparea.css
  • image files (.gif, .jpg, .png)
\apparea
  • application area
  • command keys
Yes
  • PageBuilder.jsp
  • CmdKeys.jsp
  • User-defined .css files
  • <stylename>.css
  • <stylename>.js
  • MenuKeys.jsp
  • image files (.gif, .jpg, .png)
\chrome\html and \chrome
  • layout
  • command keys
No
Note: You do not need to reconvert your source files to have any style changes take effect.

Feedback