11.12 Using Portal Style Element Classes in HTML Templates and CSSs

In Oracle Portal, there are three typical style scenarios:

  • Use styles you create through the portal's user interface.

  • Augment portal styles through a combination of Oracle Portal style element classes plus your customizations of them.

  • Provide your own custom cascading style sheet (CSS).

This section deals briefly with the second scenario: augmenting portal style element classes.

You may prefer to create custom style sheets using Oracle Portal style element classes in a CSS or embedded between <style></style> tags in a portal HTML template. For example, the standard style element class for a portlet header contains a parameter for background color but not for background image:

.PortletHeaderColor{Background-Color:#336699;}

You can augment the existing class by adding a background image parameter:

.PortletHeaderColor{Background-Color:#336699; Background-Image:url(https://company.us.myco.com:5555/images/FFFFFFr.gif);}

Note:

When you augment Oracle Portal style element classes with additional parameters, you can no longer use the Oracle Portal declarative interface to maintain the style classes. You must maintain the classes yourself in the HTML or the referenced CSS file.

By customizing Oracle Portal style element classes, you can reduce the amount of coding by simply altering these existing classes.

To ensure that you use the appropriate style classes in your CSS or between your <style></style> tags:

  • Set all the pages that will use Oracle Portal style element classes to Main style.

    Many of Oracle Portal's style element classes use the variables idn and siteidnn. The idn variable refers to the identity of the style being used. The siteidnn variable refers to the page group that owns the style. With the Main style, which is owned by the Shared Objects page group, the values of these variables are fixed—and therefore predictable: id1siteid0.

    One way to ensure that all new pages in a page group use the Main style is to set Main as the page group's default style, then select the page group configuration option Use Default Properties When Creating Page. For information on setting this option, see Section 4.5.2, "Specifying Inheritance Rules for Newly Created Pages". For information on selecting a default style for a page group, see Section 4.5.3, "Choosing a Default Style for a Page Group". For information on selecting a style for a page, see Section 11.8, "Applying a Style".

    You may want to take the further step of prohibiting users from changing page styles. To do this, edit the relevant page group's properties, deselecting Allow Privileged Users To Manage Page Style. For more information, see Section 4.3.2, "Controlling Who Can Apply a Different Style to a Page".

  • Create a CSS that includes Oracle Portal style element classes, which you can define according to your own style specifications. Or embed Oracle Portal style element classes in your HTML template (see next bullet).

    For a list and description of Oracle Portal style element classes, see Section E.2, "Style Element Classes Used with Oracle Portal Styles".

  • Create an HTML template that calls the CSS or that includes Oracle Portal style element classes.

    In the template, do not use the #page.style# tag. The #page.style# tag includes Oracle Portal style element classes in the template. This could result in conflict caused by two classes having the same name. For information on creating HTML templates, see Chapter 12, "Providing a Standard Look and Feel".

  • Apply the HTML template to your portal pages.

    For information on applying HTML templates, see Chapter 12, "Providing a Standard Look and Feel".