Oracle WebCenter Sites 11g: Customizing Global Configuration Properties, Toolbars, and Menu Bars

The client-side framework retrieves its main configuration settings from the server-side controller element, UI/Config/GlobalHtml. The client-side application executes this presentation element at startup. The presentation element serves JavaScript code, which defines a JavaScript function whose name is given as a request parameter by the client-side application:

<%@ taglib prefix="cs" uri="futuretense_cs/ftcs1_0.tld"%>
<cs:ftcs>
    webcenter.sites['${param.namespace}'] = function (config) {
        config.maxTabCount = 50;
        config.defaultView = …;
        … merge
    }
</cs:ftcs>

You manipulate the config object as needed in the function body. The client-side application sets configuration properties as specified in the UI/Config/GlobalHtml element. The client-side application can retrieve additional configuration properties from the server-side controller element and merge settings from multiple sources, without having to duplicate the global configuration properties in multiple locations. Examples of configuration settings derived from multiple sources include default global, site-specific, and custom configurations.

The following is a list of system-defined configuration properties that you can modify. For more information about system-defined configuration properties, see the Developer's Guide to Customizing the Contributor Interface.

Note: By default, enableWebMode and enableDatePreview properties take the value of the xcelerate.enableinsite and cs.sitepreview properties found in the futuretense.ini system file. You can override these values by modifying them in the futuretense.ini file or by creating a custom global configuration element, as described in the next section.

You can customize the toolbar to display actions for operating on assets in Web mode or Form mode. You can further customize it for specific asset types and their subtypes. The default toolbar for a Page asset is shown here:

The UI/Config/GlobalHtml element describes the list of actions to display for a specific view (such as inspecting an asset in Web mode or editing an asset in Form mode) in the toolbar. You configure the toolbar by using the toolbar property:

    config.toolbars = {
        "viewAlias":  {
            "view_mode_1" : [action_1, action_2, ...],
            "view_mode_2" : [action_1, action_2, ...]
    ...
    }

The viewAlias configuration setting indicates the type of view for which this toolbar is displayed. The alias must match one of the available aliases defined in the UI/Config/GlobalHtml element under config.views. Supported aliases are as follows:

The view_mode_i mode  is one of the modes supported by a view such as edit or view. For example, you can edit and view an asset in Web mode:

    config.toolbars = {
        "web":  {
            "edit" : [action_1, action_2, ...],
            "view" : [action_1, action_2, ...]
    ...
    }

The action_i configuration setting indicates an action that is included in the toolbar. Standard actions, such as save and approve, are mapped to their own icons, titles, alternative text, and so on. For example:

    config.toolbars = {
        "web":  {
            "edit" : ["form-mode", "inspect", "separator", "save", "preview", ...],
            "view" : ["form-mode", "edit", "separator", "preview", "approve", ...]

To add a custom action to the toolbar for a specific asset type in your site, you create a custom SiteConfigHtml element. In the next sections, you modify the SiteConfigHtml element to include a custom toolbar action and test your customization. The custom toolbar action adds a button to the toolbar. When you click the button, a message is displayed on the asset screen. The inspect view toolbar for an AVIArticle asset currently looks like the following:

You can add custom menu commands and actions to the menu bar for all asset types or specific asset types and their subtypes. In this section, you add a custom menu to the menu bar for the AVIArticle asset type. The custom menu consists of one custom option. The following tasks are demonstrated:

• Modifying the SiteConfigHtml.jsp element
• Testing your customization

Without any customizations, your AVIArticle menu bar looks similar to the following: