Bookshelf v7.5.3: About UI Properties in Web Templates

About UI Properties in Web Templates

The User Interface Property Designer lets you customize the way items display in a configuration session. You do this by defining a UI property for the desired items. The UI property definition is a name-value pair where the variable name is one you have entered in the Web template that controls the display of the item. The value can be a string, HTML commands, XML commands, or JavaScript that defines what you want to display instead of the default item name.

The User Interface Property Designer displays all the items in the customizable product. Define UI properties on these items as follows to change how Web templates display:

Customizable Product Name. Define a UI property for the product name to change the product name header on every selection page.

Attribute. Define a UI property for the attribute name to revise the title of the attribute. To revise the display of the attribute values, define a UI property for the LOV items or default value of the attribute.

Relationship. Like attributes, you can change either how the relationship name displays, or you can change how the items in the relationship display.

Group. Define a UI property for these items when you want to change the name that appears on the product tabs or in the wizard pages of the product theme.

Linked Item and Resource. If you display these items during a configuration session, you can customize them by defining a UI property for them. For example, consider adding a brief explanation along with a linked item name to explain what it does.

The Web Engine uses for-each loops to iterate through each level of a customizable product. At each level, it determines what items occupy that level and what Web template to use for displaying the items. When you modify a Web template and assign it to group member, the template is used to control the display of all the group member's items. For example, if you assign a radio button control template to a relationship containing five items. The control template is used to define how each of the five items displays. Thus, if you have inserted a UI property variable in the radio button control template, then you must define a UI property for all five items.

For example, you have assigned a radio button control to Relationship A in the Product UI Designer. You have inserted the UI property variable ".DisplayChange" into the radio button template. Relationship A contains five items. You want to change the display of Item A to bold. You must define a UI property for all five items:

The Name in all five UI property definitions is the same: DisplayChange. Do not put a period (.) before the name.

For Item A the Value of the UI property is <b>Item A</b>

For the remaining four items, the Value of the UI property is the item name, without any HTML formatting; for example, Item B.