10.3 Working with Tabs

Tabs enable you to increase the amount of information on a page without increasing the amount of congestion. For example, suppose you want to create a home page for your entire user base. The information you want to provide encompasses several different areas, each of which is relevant to certain users: technical, human resources, marketing, and finance. To present all of the information on one page, you can place each area of focus on its own tab (Figure 10-38):

Figure 10-38 Four Tabs

Four tabs

A tab can be in one of two states: active or inactive. An active tab is a tab that is currently selected within a tab set. In Figure 10-38, the Technical tab is the active tab. The rest of the tabs are inactive. You can specify different colors, fonts, and images for active and inactive tabs.

How you use tabs depends on how you plan to implement navigation within your portal. Tabs offer a simple way to deploy a tab-set navigation model that includes many of the same capabilities available with a page.

The Oracle Portal tab feature is just one way of realizing a tab set in your portal design. Using standard HTML techniques in combination with portal pages, you can implement many others. For example, use JavaScript to create an effect that visualizes portal pages and sub-pages as a series of tabs in a tab set.

For more information about navigation, see Chapter 13, "Designing Your Portal's Navigation".

For information about securing a tab, see Chapter 17, "Protecting Your Content".

This section explores some of the ways you can work with tabs using the inherent capabilities of Oracle Portal. It includes the following subsections:

10.3.1 Adding a Tab to a Page

To add a tab to a page:

  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 page on which to add a tab.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page on which to add a tab.

    This opens the page in Edit mode.

  5. In the region on which to add a tab, click the Add Tab icon.

    The region now looks like Figure 10-39.

    To add more tabs at the same level, click the Add Tab icon that displays to the side of the tab you just added (Figure 10-39). If you click the Add Tab icon under the tab, you'll start another row of tabs under the first row (that is, you will create sub-tabs).

    Figure 10-39 Creating a new tab at the same level

    Adding a tab at the same level of a previous tab

The first tab you create on a region, contains the region. For example, when you click the Add Tab icon in an item region's toolbar, the tab is created and it contains the item region from which it was created. The second and subsequent tabs that you create in the same tab set contain their own blank content regions.

When you add a tab to a center-aligned region, the tab is initially centered—even though Center is not a tab alignment option. To change the alignment of the tab, edit the tab region and click OK. You may note that when you edit the tab region, left-alignment is already selected for the region. Nonetheless, the tab does not initially display left-aligned because it has taken its defaults from the region from which it was created. For information on changing tab alignment, see Section 10.3.5, "Changing the Alignment of Tabs".

If there is a portlet or item you want to display no matter what tab is active—say, a link to your corporate Web page—divide your page into two regions: one containing the portlet or item, the other containing the tabs (Figure 10-40).

Figure 10-40 A Region for a Logo and a Region for a Tab Set

Two regions, one with no tabs and one with three

10.3.2 Naming a Tab

When you first add a tab to a page, the text displayed on the tab defaults to New Tab. You can change this text to label the tab in keeping with its intended purpose.

Note:

To change tab text, you must have at least the tab privilege Manage. However, if you can personalize a page, you can personalize the text of the tabs you add. But you cannot personalize the text of tabs added by another user.

To change tab text:

  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 page on which to rename a tab.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page on which to rename a tab.

    This opens the page in Edit mode.

  5. Click the Edit Tab icon on the relevant tab (Figure 10-41).

    Figure 10-41 The Edit Tab Icon

    Edit Tab icon

  6. In the Name field, enter a name for the tab.

    Enter up to 60 characters. Use any characters, except the following:

    , & # % \ / : * ? < > | "

    The Name is case sensitive and must be unique within its tab set. Tab set means all tabs at the same level, excluding sub-tabs (which are members of their own tab sets). The Name must also be unique among sub-pages of the containing page.

    Note:

    In the Oracle Portal user interface, an asterisk (*) indicates a field that requires a value.

    The tab Name is used in path-based URLs to access the tab.

    Note:

    For more information on the formation of URLs, see Appendix C, "Formation of URLs in Oracle Portal".

  7. In the Display Name field, enter the text to display on the tab.

    Enter up to 256 characters of any kind. The Display Name defaults to New Tab if unspecified. When you use your own tab images, rather than the default image supplied by Oracle Portal, the Display Name is used as Alt text when users move their mouse pointers over the tab. When you use your own tab images, the images must include whatever text you care to display.

    Note:

    For a summary of the rules governing the naming of objects in Oracle Portal, see Appendix D, "Object Naming Rules in Oracle Portal".

  8. Click OK to save your changes and return to the page.

10.3.3 Rearranging the Order of Tabs in a Region

In perfecting or updating your page design, you may find that the original display order of a tab set requires rearrangement. In Oracle Portal it is a simple process to rearrange the order of tabs.

Note:

To rearrange tabs on a page, you must have at least the page privilege Manage Content. However, if you can personalize a page, you can also rearrange the order of tabs in your own view of a page.

To rearrange the order of tabs:

  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 page where the tabs are located.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page where the tabs are located.

    This opens the page in Edit mode.

  5. Click the Arrange Tabs icon in the relevant region (Figure 10-42).

    Figure 10-42 The Arrange Tabs Icon

    Arange Tabs icon

    This opens the Arrange Tabs page.

  6. In the Arrange Tabs list, select a tab and use the Move icons to reorder it in relation to the other tabs in the list.

  7. Repeat step 6 for the tabs to be rearranged.

  8. Click OK to save your changes and return to the page.

10.3.4 Hiding/Showing Tabs

In some situations, you may want to hide a tab from users. For example, you may want to work on a tab before you make it available to other users. When you hide a tab, other users cannot see the tab when they view the page; however, as the tab's creator, you can see and work with it in Edit mode. Some users will be able to see the tab when they edit or personalize the page, but it will be identified as a hidden tab, and they cannot access it.

System level caching options affect whether a hidden tab is visible in the Graphical view of page Edit mode. This is because when the page definition or the fully assembled page content is cached at the system level, the same information is rendered from the same source for all users:

  • On pages cached at the user level, hidden tabs display (as Hidden) only to users with a minimum of the page or tab privilege Manage Content. Hidden tabs do not display to other users.

  • On pages where the page definition only is cached at the system level, hidden tabs display (as Hidden) only to users with a minimum of the page or tab privilege Manage Content. Hidden tabs do not display to other users.

  • On pages cached at the system level for a specified period (expiry caching), hidden tabs display (as Hidden) to all users.

Note:

To hide or show a tab on a page, you must have at least the page privilege Manage. However, when you have personalization privileges on a page, you can hide and show tabs when you personalize the page.

When you hide tabs as you personalize a page, tabs are hidden only in your view of the page; other users are still able to see the tabs.

This section describes how to hide one or more tabs. It contains the following subsections:

10.3.4.1 Hiding and Showing a Tab

To hide a single tab:

  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 page where the tab is located.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page where the tab is located.

    This opens the page in Edit mode.

  5. Click the Actions icon on the tab to be hidden (Figure 10-43).

    Figure 10-43 The Actions Icon

    Actions icon

    This opens the Select Action page.

  6. Click the Hide link.

    The tab displays grayed out in Edit mode. If you switch back to View mode, the tab no longer displays. You can still edit the tab in Edit mode and show it again, if required.

To show a hidden tab, click the Actions icon on the tab (see Figure 10-43), and select Show.

10.3.4.2 Hiding and Showing Multiple Tabs at Once

To hide more than one tab:

  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 page on which the tabs are located.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page on which the tabs are located.

    This opens the page in Edit mode.

  5. Click the Editing Views: Layout link in the toolbar at the top of the page.

  6. In Layout view, select the check box next to any tabs you want to hide.

  7. Click the Hide button next to Actions at the top of the page.

To show a hidden tab (in Layout view), select the check box next to any tab you want to display, and click the Show button next to Actions at the top of the page.

10.3.5 Changing the Alignment of Tabs

You can specify whether tabs display on the left or right side of a region. Additionally, you can specify that they display at a region's start or end. This enables you to automatically shift tab display according to the reading direction of the current portal language. This is particularly useful in environments where you must accommodate bidirectional languages.

You can align only pre-existing tabs. That is, you cannot preset tab alignment before you have created any tabs.

Figure 10-44 shows the same region with different tab alignment settings:

Figure 10-44 Same Region Shown with Different Tab Alignment Settings

Illustration of left and right tab alignments

To change tab alignment:

  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 page where the tabs are located.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page where the tabs are located.

    This opens the page in Edit mode.

  5. Click the Edit Region icon in the region where the tabs are located (Figure 10-45).

    Figure 10-45 The Edit Region Icon

    Edit Region icon

    Note:

    Be sure to click the icon in the tabbed region itself (that is, the icon to the right of the tabs), not in a region within the tab.

  6. On the resulting page, select an alignment option from the Tab Alignment list.

    Choose from:

    • Left to align tabs against the left border of the region

    • Right to align tabs against the right border of the region

    • Start to align tabs according to reading direction of the portal's current language: in languages that read left to right, Start aligns tabs left; in languages that read right to left, Start aligns tabs right

    • End to align tabs according to the reading direction of the portal's current language: in languages that read left to right, End aligns tabs right; in languages that read right to left, End aligns tabs left

    Note:

    When you add a tab to a center-aligned region, the tab is initially centered—even though Center is not a tab alignment option. To change the alignment of the tab, edit the tab region and click OK. You may note that when you edit the tab region, left-alignment is already selected for the region. Nonetheless, the tab does not initially display left-aligned because it has taken its defaults from the region from which it was created.

  7. Click OK to return to the page.

10.3.6 Changing a Tab Image

With some page designs, you may want to use your own tab images in lieu of the default images provide by Oracle Portal. Add images for both active and inactive tabs. The active image displays when the tab is selected; the inactive image displays when the tab is not selected. Additionally, you can add a rollover effect so that the active image displays on an inactive tab when a user moves the mouse pointer over the tab (see Section 10.3.7).

If you do not want a visual difference between active and inactive tabs, you can add just the active tab image. This will be used for both active and inactive tabs.

When tab images other than the default tab images are used, the tab display name is not displayed on the tab, as it is with default tab images. Instead, the display name is used as Alt text, which pops up when a user rolls the mouse pointer over an inactive tab. If you want tabs that use images other than default tab images to be labeled, you must provide images that include their own label text

Note:

To change a tab image, you must have at least the tab privilege Manage on the relevant tab. However, if you have full personalization privileges on a page, you can change the images of the tabs you add when you personalize the page. When personalizing, you cannot upload tab images for tabs that you did not create yourself.

The image must be a type that can be viewed in a browser, for example, JPEG or GIF.

To change tab images:

  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 page where the tabs are located.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page where the tabs are located.

    This opens the page in Edit mode.

  5. Click the Edit Tab icon on the relevant tab (Figure 10-46).

    Figure 10-46 The Edit Tab Icon

    Edit Tab icon

    This opens the Edit Tab page.

    Note:

    Be sure to click the Edit icon that displays directly on the tab, rather than the one that displays next to or beneath the tab.

  6. Click the Browse button next to the Active Tab Image field to locate and select a graphic to display on the foremost tab.

    Alternatively, you can manually enter the location and file name of the image, for example:

    c:\webimages\maintab_on.gif

  7. Optionally, click the Browse button next to the Inactive Tab Image field to locate and select a graphic to display on tabs that are not foremost.

    Alternatively, you can manually enter the location and file name of the image, for example:

    c:\webimages\maintab_off.gif

    Note:

    Provide an inactive tab image if you want the tab to look different when it is not the currently selected tab or if you want to use a rollover effect (see Section 10.3.7). Otherwise, an inactive tab image is not required for the tab image option to work.

  8. Click OK to save your changes and return to page.

To delete a tab image, take Steps 1 through 5, then click the Delete icon next to the image. (The delete icon displays only when there is a tab image other than a default tab image.)

10.3.7 Adding a Rollover Effect to Tabs

With a rollover effect, an inactive tab image switches to an active tab image when users move their mouse pointers over the tab. You can add a rollover effect to a tab by enabling the rollover effect in the tab region and applying active and inactive images to the tabs.

For the rollover effect to work properly, you must add active and inactive tab images other than default tab images (see Section 10.3.6), and there must be at least one tab on the page. That is, you cannot preconfigure a rollover effect before any tabs are created. The rollover effect executes in page View mode, but not in page Edit mode.

To add a rollover effect to a tab:

  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 page where the tabs are located.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page where the tabs are located.

    This opens the page in Edit mode.

  5. Click the Edit Region icon in the relevant tab region (Figure 10-47).

    Figure 10-47 The Edit Region Icon

    Edit Region icon

    Note:

    Be sure to click the icon in the tab region itself (that is, the icon to the right of the tabs), rather than the one on or beneath the tab.

  6. On the resulting page, go to the Region Display Options section, and select Use Rollover Effect For Tab Images.

  7. Click OK to save your changes and return to the page.

  8. Edit each tab to specify active and inactive images (see Section 10.3.6).

The active tab image executes in View mode when users move their mouse pointers over an inactive tab.

10.3.8 Deleting Tabs

The task of deleting a tab is straightforward and simple; however, there are a few things to consider before you proceed. When you delete a tab that includes content, the content is deleted along with the tab. There is no opportunity to move the content during the delete operation. Be sure to move any content you want to keep before you delete a tab.

Additionally, if the tab is derived from a template, you can delete the tab only if you also have delete content privileges on all the tabs on pages that are based on the template. This is to prevent users without the appropriate privileges from managing content.

You can delete one tab at a time or multiple tabs at once. This section describes how to do both. It contains the following subsections:

Note:

To delete a tab from a page, you must have at least the page privilege Manage on the parent page, that is, on the page that contains the tab you are deleting, or on the tab that contains the sub-tab you are deleting.

If you have full personalization privileges on a page, you can delete any tabs you create when you personalize the page; but you cannot delete tabs that you did not create.

10.3.8.1 Deleting One Tab

To delete a single tab from a page:

  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 page where the tab is located.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page where the tab is located.

    This opens the page in Edit mode.

  5. Click the Actions icon on the tab to be deleted (Figure 10-48).

    Figure 10-48 The Actions Icon

    Actions icon

    This opens the Select Action page.

  6. Click the Delete link.

  7. In the confirmation page, click Yes.

    The tab and all of its content are deleted.

10.3.8.2 Deleting Multiple Tabs Simultaneously

To delete multiple tabs simultaneously:

  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 page where the tabs are located.

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

  4. Under Pages in the Layout & Appearance section, click the link to the page where the tabs are located.

    This opens the page in Edit mode.

  5. Click the Editing Views: Layout link in the toolbar at the top of the page.

  6. In Layout view, select the check box next to each tab you want to delete.

  7. Click Delete.

  8. In the confirmation page, click Yes.

    All of the selected tabs and their content are deleted.