Changing Portlet Heading and Text Colors and Fonts

11-16 Oracle Fusion Middleware Users Guide for Oracle Portal

6. In the Style Element Properties section, choose a tab style element to define.

For a list and description of style elements that are relevant to tabs, see Section 11.3.2, Tabs .

7. Click a color in the color palette, or enter a hexadecimal value in the Color field.

Clicking in the palette automatically populates the Color field with a hexadecimal value.

8. Select a Font Decoration:

■ None for no decoration see the following Note ■ Plain for no decoration see the following Note ■ Underline for underlined text ■ Line-Through for lined-out text ■ Underline Linethrough for underlined text that is also lined out

9. Select a Font Face.

The Default font face renders the text in the default font specified by the users browser.

10. Specify a Font Size and select a unit of measurement:

■ px fixed unit pixels, though relative to the viewers monitor ■ pt fixed unit points ■ em relative unit relative to the font size of the last specified font ■ ex relative unit relative to the X size of the last specified font ■ relative unit relative to the font size of the last specified font

11. Select a Font Style:

■ Plain ■ Bold ■ Italic ■ Bold Italic 12. Click Apply. The Preview section is refreshed to show your color and font selections. 13. Edit the tab style elements as desired. Note: The Plain and None selections provide the same effect for most item-types. However, when applied to items displayed as hyperlinks, they behave differently: ■ When None is applied to a hyperlink, the way the hyperlink is displayed is determined by a users browser settings. That is, it displays as either plain or underlined according to how the users browser is configured. ■ When Plain is applied to a hyperlink, the hyperlink is always displayed as Plain not underlined, no matter what the settings in the users browser. Working with Colors and Fonts 11-17 Click Apply after changing each element. 14. Click Close to save your changes and exit the Edit Style page.

11.7 Defining Common Style Elements

In addition to the specific style elements that belong to tabs, portlets, and items, you can define the appearance and fonts used for common elements, such as banners or page or item region backgrounds. Define background images and colors for an item region or a page, the height and alignment of banners, and banner colors and fonts. This section describes how to define the colors and fonts for commonly used style elements. It includes the following sub-sections: ■ Section 11.7.1, Changing the Page or Region Background ■ Section 11.7.2, Designing Styles for Banners

11.7.1 Changing the Page or Region Background

You can select a background color or image for a page or an item region by editing the style it uses. Figure 11–11 shows the same item region with different background color settings. Figure 11–11 Same Item Region with Different Background Color Settings If your background image is smaller than the page or item region, it will repeat as a pattern to cover the whole page or region. Use care when changing a style: any changes you make affect the appearance of all pages and sub-page, tab, and item regions that use the style. To change the page or item region background: Note: When a page uses an HTML page skin template, the page background color is taken from the template and any background color specified in a defined style is ignored. An exception to this is when the page skin uses a class generated by an Oracle Portal style. For example, you can place an Oracle Portal style element class in the body HTML tag: BODY style=margin:0px class=Bodyid2siteid0. Should you change the style declaratively, through the Oracle Portal user interface, the change is reflected as well in the template that references the style class. This enables you to change the Background Color of all pages that use the page skin through the declarative style. For more information on Oracle Portal style element classes, see Section 11.12, Using Portal Style Element Classes in HTML Templates and CSSs . For the Background property of the Common style element, if you enter a hexidecimal color value that does not also appear in the color palette, tabs and portlets do not display with rounded corners. 11-18 Oracle Fusion Middleware Users Guide for Oracle Portal 1. Log in to Oracle Portal.

2. Click the Build tab to bring it forward.

3. From the Page Groups portlet Work In drop-down list, select the page group that

owns the relevant style. By default, the Page Groups portlet is located on the Build tab of the Portal Builder page.

4. Under Styles in the Layout Appearance section, click the style to be edited.

This opens the Properties tab of the Edit Style page.

5. In the Style Element Type section, select Common.

6. In the Style Element Properties section, select Background.

For a list and description of style element properties relevant to common elements, see Section 11.7, Defining Common Style Elements .

7. Click a color in the color palette, or enter a hexadecimal value in the Background

Color field, for example CC9999. Clicking in the palette automatically populates the Background Color field with a hexadecimal value. If you enter a hexidecimal color value that does not also appear in the color palette, tabs and portlets do not display with rounded corners.

8. To apply an image to the background of the page or region, click the Browse

button next to the Background Image field to locate the image on your file system. Alternatively, enter the name and location of the image you want use in the Background Image field, for example: c:\webimages\pagebg.gif The image file must be of type JPEG, GIF, or PNG.

9. Click Apply.

The Preview section is refreshed to show your color and image selections. 10. Click Close to save your changes and exit the Edit Style page.

11.7.2 Designing Styles for Banners

You can call out page areas that are dedicated to specific topics or purposes by adding colorful, labeled banners to item regions. Control the text alignment and the thickness and color of a banner by editing the style that is applied to the item region. This section describes how to change banner thickness, color, and text alignment for item region banners. It contains the following subsections: ■ Section 11.7.2.1, Changing Banner Thickness and Text Alignment ■ Section 11.7.2.2, Changing Banner Colors and Fonts Tip: If the style is used by more than one page group, look in the Shared Objects page group. Tip: To delete a background image, click the Delete icon next to the image.