Siebel 8.
0 Essentials
UI Layer Configuration: Web Templates
1 of 28
Module 23: UI Layer Configuration: Web Templates
Module Objectives
To understand the role of Siebel Web Template files and Siebel tags
in the template files To list the various types of templates To describe how to register, associate and bind a template file
UI Layer Configuration: Web Templates
3 of 28
Tailoring the Physical User Interface (UI)
The physical UI is tailored by editing template files and cascading
style sheets.
Use HTML or text editor to modify layouts
Use a text editor to customize
UI Layer Configuration: Web Templates
4 of 28
Siebel Web Template Files
Siebel Web Template Files are HTML files with Siebel tags that
specify how to render the Siebel application web page in the users browser.
They specify the layout and formatting of:
Graphics and text elements. User data.
Standard HTML tags
Siebel tag
UI Layer Configuration: Web Templates
5 of 28
Siebel Web Template Files
They are located in the WEBTEMPL directory in a Siebel installation The files have a .swt extension They are edited using a text or an HTML editor
Can include other template files via swe:include tag
They reference Cascading Style Sheet (.css) files
Siebel tag to include another Siebel template file
UI Layer Configuration: Web Templates
6 of 28
Siebel Tags
These are special tags inserted into the web template files
Specify how objects defined in the Siebel Repository should be laid out and formatted for display in the users browser
Iterate to control layout repetitively
They serve as placeholders for Siebel-specific content
Siebel tag for iteration Siebel tag to insert link
UI Layer Configuration: Web Templates
7 of 28
Cascading Style Sheets
Cascading Style Sheets are modified to define global parameters
Fonts, foreground and background colours, etc.
They are located in PUBLIC\enu\FILES directory in a Siebel
installation They are edited for achieving the desired look and feel
Backup the present .css files Edit .css files with your preferred HTML editor
UI Layer Configuration: Web Templates
8 of 28
Web Template Object Definition
A layer of abstraction between a UI object definition (View, Applet, or
Web Page) and the file itself UI object definitions reference Web Template object definitions References an HTML Web Template file
Changes are propagated to all objects that reference the file
UI Layer Configuration: Web Templates
9 of 28
Web Template Placeholders
Web Template Placeholders contain placeholders for Siebel logical UI
definitions Definitions map to Siebel Web Templates
Placeholder
UI Layer Configuration: Web Templates
10 of 28
Web Template Explorer
Web Template Explorer is used in tools to:
Examine the contents of a template file Invoke an editor to modify the template file Identify other template files included in a template file
It highlights Siebel tags for easy
swe tag highlighted Parent template
viewing Navigate to View > Windows > Web Templates Window
Child Template
UI Layer Configuration: Web Templates
11 of 28
Types of Web Templates
Form Applet Web Templates
List Applet Web Templates
View Web Templates Web Page Web Templates
UI Layer Configuration: Web Templates
12 of 28
Form Applet Web Templates
They define the layout of form applets
Placeholder provides starting point for building applet Set template file parameters in Web Layout Editor in Siebel Tools
Web Layout Editor
In the UI
UI Layer Configuration: Web Templates
13 of 28
List Applet Web Templates
They define the layout of list applets Standard Interactivity list applets use Base and Edit modes
UI Layer Configuration: Web Templates
14 of 28
List Applet Web Templates
High Interactivity list applets use EditList mode
An editable list of data
EditList mode supports querying and data entry directly in the list
UI Layer Configuration: Web Templates
15 of 28
View Web Templates
These define the layout of a view Common View Web Templates include:
UI Layer Configuration: Web Templates
16 of 28
Web Page Web Templates
They define the layout of Web Pages such as:
Login page Error page Container page
Login Web Template defines layout of login page
UI Layer Configuration: Web Templates
17 of 28
Using Template Files
Using template files requires three types of relationships:
Registering creates an object definition in the repository Associating identifies the Web Template used to render an applet or view Binding fastens a control to a specific position on the page or an applet to a view
UI Layer Configuration: Web Templates
18 of 28
Registering a Template File
Registering a template file: Creates a Web Template object definition to define the logical name for the template Creates a Web Template File object definition to reference the actual physical file
Logical name in repository for template
Actual name of the physical template file
Type of web template
UI Layer Configuration: Web Templates
19 of 28
Associating an Applet with its Template
This process creates an Applet Web Template object definition to
specify the associated web template
Different applet modes can reference different web templates
Applet modes
Applet Web Templates used
UI Layer Configuration: Web Templates
20 of 28
Associating a View with its Template
This process creates a View Web Template object definition to specify
the associated web template
Each view references a single view web template
Web Template used to render view
UI Layer Configuration: Web Templates
21 of 28
Associating a Web Page with its Template
This process creates a Web Page object definition and sets the Web
Template property
Web Template used to render login page
UI Layer Configuration: Web Templates
22 of 28
Binding
Binding maps the components of an applet or view to placeholders in
the corresponding template file Information is specified in the repository:
View Web Template Item Applet Web Template Item Web Page Item Results in the corresponding element being displayed at runtime
UI Layer Configuration: Web Templates
23 of 28
Applet Web Template Items
Applet Web Template Items are created by the binding process Item identifier is the id attribute value in the swe:control tag This is used at runtime by the SWE to identify the controls making up
an applet
UI Layer Configuration: Web Templates
24 of 28
View Web Template Items
View Web Template Items are created by the binding process Item identifier is the id attribute value in the swe:applet tag It is used at runtime by the SWE to identify the applets making up a view
UI Layer Configuration: Web Templates
25 of 28
Web Page Items
Web Page Items identify the links and buttons appearing on a Siebel
Web page Item identifier is the id attribute value in the swe:pageitem tag It is used at runtime by the SWE to position the links and buttons
UI Layer Configuration: Web Templates
26 of 28
Module Highlights
Siebel Web Template Files are HTML files that specify how to render
UI for a Siebel application in the users browser
Can reference css files Can include other template files
The four Web Template types are Form Applet, List Applet, View and
Web Page Template files require three types of relationships: Associating, Binding and Registering
UI Layer Configuration: Web Templates
27 of 28
Lab
In the lab, you will:
Examine Web Templates
UI Layer Configuration: Web Templates
28 of 28