Portlet Factory, Version 6.1.2


 

Using UI overrides for internationalization

The List builder's User Interface Overrides allow you to specify text for each of the buttons generated by the builder. You can use an indirect reference or enter button text directly . There is also an input in this section (Base Page URL) that lets you substitute custom HTML for the basic structure of the list.

The two default HTML pages (in factory/pages: list_builder_horizontal.html and list_builder_vertical.html) have named elements and styles, and builders can target these to make more subtle overrides without having to swap out the base HTML.

In most cases, you can fine tune the appearance of the List builder-generated UI either by providing a CSS stylesheet (the classes listBuilderOuterTable, listBuilderTitle or listBuilderSelect are used in the default HTML) or by targeting the named elements (prefixed by "list") with other builders, such as Attribute Setter.

If you need to make a more drastic visual change, you can supply your own HTML to serve as a base. This HTML must have elements with the same names as are present in the default HTML files, and must retain the JavaScript reference included in these files. The easiest way to construct a custom HTML base page is to copy either the horizontal or vertical default HTML page, and make the desired modifications.

You can also use images as buttons in three ways:

  • Use Image builders to override the buttons, targeting the "listAddButton", "listRemoveButton", "listAddAllButton" and "listRemoveAllButton" spans

  • Use images instead of the buttons in a custom base HTML page

  • Target Image Button builders at the button elements like Image above, and use a "do-nothing" script as the action (for example, void 0)

Parent topic: List builder


Library | Support |