6 Creating, Editing, and Deleting Pages

WebCenter Spaces puts within easy reach every resource necessary for building, managing, revising, and removing pages, with multiple options for performing these tasks to suit your working style. For example, you can create pages through the WebCenter Spaces Manage Pages dialog (Figure 6-1) and through the Create Page command on the Page Actions menu (Figure 6-2).

Figure 6-1 Create Page Button in the Manage Pages Dialog

Create Page button

Figure 6-2 Create Page Command on the Page Actions Menu

Create Page command on Page Actions menu

This chapter provides information about creating pages, editing pages, switching page styles and schemes, working with page layout components, initiating page-related actions from page tabs, and deleting pages. It contains the following sections:

See Also:

For information about creating pages through the WebCenter Spaces Manage Pages dialog, see Chapter 5, "Working with the Manage Pages Dialog."

For introductory information to pages and the page editor (Oracle Composer), see Chapter 4, "Introducing the Page Service and Oracle Composer."

Audience

This chapter is intended for users who want to create and edit pages, revise page layouts, and delete pages. By default, every authenticated user can perform the actions described in this chapter in their own personal spaces. Note, however, that your application administrator may alter such default access privileges.

Sufficient access privileges must be assigned—through the grant of privileges or the assignment of a role—to create or edit pages in group spaces and custom WebCenter applications.

Much of the information in this chapter also applies to custom WebCenter applications, though it is written with WebCenter Spaces users in mind. (For information about the Page service in custom WebCenter applications, see the chapter "Enabling the Runtime Creation and Management of Pages" in Oracle Fusion Middleware Developer's Guide for Oracle WebCenter.)

Your application administrator has the authority to expose or hide a particular service's task flows. Tasks discussed in this chapter are not available to you if the associated task flow is hidden.

See Also:

For information about WebCenter Spaces seeded user roles, see the "Default Policy Store Permissions" section in the Oracle Fusion Middleware Administrator's Guide for Oracle WebCenter.

6.1 Creating Pages

In WebCenter Spaces, you can find the Create Page command in the following places:

To create a page:

  1. Log in, and go to the location in the application where you want to create a page.

  2. From the Page Actions menu, select the Create Page command to open the Create Page dialog (Figure 6-6).

    Figure 6-6 The Create Page Dialog in a WebCenter Spaces Application

    Create Page dialog
    Description of "Figure 6-6 The Create Page Dialog in a WebCenter Spaces Application"

    Note:

    If you are creating a page in a personal space, and you set page defaults to create the page and bypass the Create Page dialog, then, after this step, the new page is created and opened in Oracle Composer.

    See Also:

    For information about Oracle Composer, see Section 4.2, "Introducing Oracle Composer."

  3. In the Page Name field, enter a display name for the new page.

    The name you enter here appears on the page's tab and in the Manage Pages dialog. A value is required for this field, as indicated by the asterisk (*) shown in front of the field label.

  4. Optionally, select a page design scheme from the Scheme menu.

    The Scheme menu provides a selection of background images for the new page. For illustrations of these, see Table 5-1, "Seeded Page Schemes".

    Select Custom to provide your own custom background image. When Custom is selected, a Scheme Background Image field opens in the Create Page dialog.

    Enter the path to the image.

  5. Optionally, pick a page background color from the Scheme Background Color dropdown list.

  6. Select a page style to define the page structure.

    See Table 5-2 for illustrations and descriptions of out-of-the-box page styles.

  7. Click the Create button.

    The new page opens in Oracle Composer, the WebCenter page editor, ready for adding content (Figure 6-7).

    Figure 6-7 A Page Viewed Through Oracle Composer

    Page viewed through WebCenter Composer
    Description of "Figure 6-7 A Page Viewed Through Oracle Composer"

    For information about adding content, see Chapter 7, "Working with Page Content." For information about Oracle Composer, see Section 4.2, "Introducing Oracle Composer." For information about working with the page layout, look, and feel, see Section 6.4, "Working with Page Layouts, Styles, and Schemes."

    Note:

    When you encounter errors in page edit mode, you can recover by closing your browser and then reopening it and relogging in to the application instance.

6.2 Editing Pages

Edit a page to customize its content or to add or delete content. In edit mode, you can also reset a page to remove all changes made to it since it was first created. This section describes how to enter and exit page edit mode and how to reset a page to its pristine state. It contains the following subsections:

Note:

If you view a page at the same time that another user is editing the page, you may not immediately see the results of those edits in your session. To reliably see any changes, view the page after the other user has saved.

If you edit a page while another user is editing the same page, a concurrency warning appears toward the top of the page.

See Also:

For more information, see Section 6.2.1, "Entering and Exiting Page Edit Mode."

6.2.1 Entering and Exiting Page Edit Mode

In WebCenter Spaces, entering page edit mode—that is, opening Oracle Composer—involves selecting the Edit Page command from the menu on a page tab (for more information about Oracle Composer, see Section 2.5, "Initiating Actions from Tabs") or from the Page Actions menu.

Exiting, just as easy, involves clicking a Close button.

Because users access WebCenter Spaces from the Web, multiple users may attempt to edit the same page at the same time. In such cases, a concurrency warning appears in Oracle Composer that alerts each user to the others (Figure 6-8).

Figure 6-8 A Concurrency Warning in Oracle Composer

Concurrency warning in Oracle Composer

Note:

Time duration is added to the concurrency message only when the first or a subsequent concurrent user has made (but not yet saved) a page customization.

WebCenter applications do not support single-user concurrency. That is, one user cannot log in to the same WebCenter application at the same time to create multiple, simultaneous sessions.

The final state of the page is determined by the last user to save.

This section describes how to open Oracle Composer through the WebCenter Spaces Page Actions menu.

To enter and exit Oracle Composer:

  1. Log in, and go to the page you want to edit.

  2. From the Page Actions menu, select Edit Page to open Oracle Composer (Figure 6-9).

    Figure 6-9 Edit Page Command on the Page Actions Menu

    Edit Page command on Page Actions menu

    The page opens in Oracle Composer (Figure 6-10).

    Figure 6-10 A Page Viewed Through Oracle Composer

    Page viewed through WebCenter Composer
    Description of "Figure 6-10 A Page Viewed Through Oracle Composer"

    Tip:

    If the Edit Page command is not available on the Page Actions menu or the Page Actions menu does not appear, it is likely that you do not have sufficient page access privileges. If this is the case, ask your application administrator for the privilege to edit pages.

    For more information, see Section 2.7, "Contacting Your Application Administrator."

  3. Edit the page.

    See Also:

  4. Click the Save button to save your changes and remain in Oracle Composer (Figure 6-11).

    Figure 6-11 The Save Button

    Save button

  5. Optionally, click the Close button to exit Oracle Composer (Figure 6-12).

    Figure 6-12 The Close Button

    Close button in Oracle Composer

6.2.2 Removing All Edits, Personalizations, and Customizations from a Page

Oracle Composer includes a control for resetting a page to the state it was in when it was first created. The Reset Page button removes all edits, regardless of when they were made, and restores the page to its original, newly-created state. This is particularly valuable for maintaining pages that users have linked to. Resetting a page enables you to take the page back to its original state without disrupting such connections.

See Also:

The Page Actions menu provides the Reset Layout command for removing just the personalizations you have made to a page. For more information, see Section 3.4, "Removing Your Page Personalizations."

If multiple users are editing a page, and one of them clicks the Reset Page button, the changes made by the other users may nonetheless be saved to the reset page. The result depends on the order in which users save their changes. The final state of the page is determined by the last user to save. For more information, see Section 4.2.1, "Accessing Oracle Composer."

To reset a page:

  1. Log in, and go to the page you want to reset.

  2. From the Page Actions menu, select Edit Page to open Oracle Composer (Figure 6-13).

    Figure 6-13 Edit Page Command on the Page Actions Menu

    Edit Page command on Page Actions menu

    Tip:

    If the Edit Page command is not available on the Page Actions menu or the Page Actions menu does not appear, it is likely that you do not have sufficient page access privileges. If this is the case, ask your application administrator for the privilege to edit pages. See Section 2.7, "Contacting Your Application Administrator."

  3. Click the Reset Page button at the top of Oracle Composer (Figure 6-14).

    Figure 6-14 Reset Page Button

    Reset Page button

  4. In the resulting Reset Page dialog, click the Reset Page button (Figure 6-15).

    Figure 6-15 Reset Page Dialog

    Reset Page dialog

    All changes made to the page since it was created are removed.

  5. Click the Save button at the top of the page.

    The page refreshes, now restored to its pristine, out-of-the-box state.

  6. Click the Close button to exit Oracle Composer.

6.3 Setting Page Access

Page properties include a Security tab with controls for specifying who can do what to the current page (Figure 6-16).

Figure 6-16 Security Tab in the Page Properties Dialog of a Page in a Group Space

Security tab in Page Properties dialog

In WebCenter Spaces, the options that appear on the Security tab vary according to whether you are accessing it from a group space page or from a personal space page.

Group space security provides the additional option of inheriting page access permission settings from the application.

Page access setting through the Page Properties dialog equals page access setting though the Manage Pages dialog, which is discussed in Section 5.7, "Setting and Revoking Page Access Permissions." This section describes how to locate page access settings through page properties, and then directs you to the section in the Manage Pages chapter where page access setting is discussed.

Note:

Page access permissions set through the Page Properties dialog in Oracle Composer are committed immediately. Closing Oracle Composer without saving does not discard such changes.

Page access permissions set through the Manage Pages dialog take effect after you click OK.

To access the Security tab in the Page Properties dialog:

  1. Go to the page you want to secure, and open it in Oracle Composer.

  2. Click the Page Properties button (Figure 6-17).

    Figure 6-17 Page Properties Button in Oracle Composer

    Page Properties button in Oracle Composer

  3. In the resulting Page Properties dialog, click the Security tab to bring it forward (Figure 6-18).

    Figure 6-18 Security Tab in the Page Properties Dialog

    Security tab in Page Properties dialog

For information about using the page access controls that display on the Security tab, See Section 5.7, "Setting and Revoking Page Access Permissions."

Note:

When you encounter errors in page edit mode, you can recover by closing your browser and then reopening it and relogging in to the application instance.

6.4 Working with Page Layouts, Styles, and Schemes

Creating the perfect page is a process that may happen over a period of days. You may select a page style or scheme and think better of it later on. With WebCenter Spaces, this presents no problem. It is an easy task to move from one page style or scheme to another. Additionally, you can enhance the style and scheme you selected using the layout components available through the Oracle Composer Catalog.

This section provides information about working with page styles, schemes, and layout components. It contains the following subsections:

6.4.1 What You Should Know About Page Layouts, Styles, and Schemes

Page styles and schemes provide both a default page structure that describes the areas where you can place content (that is, the page layout) and a background color and image that contribute to a page look and feel. Page layout components provide objects for enhancing the usefulness and appearance of a given page. These include an in-place HTML text editor, images, layout boxes, hyperlinks, and so on.

You can select a page style, scheme, and scheme background color when you create a page. Such selections are available in the Create Page dialog (Figure 6-19).

Figure 6-19 Seeded Page Styles in a WebCenter Spaces Application

Seeded page styles

Some page styles come prepopulated with a selection of useful task flows. Others include properties that suggest a particular use for the page. For example, the Web Page page style includes a configurable property for specifying a URL. You can use this feature to expose external Web content within your WebCenter application.

In many cases, you can switch styles and schemes when you revise a page. You can also start with a blank page and create you own, unique layout, look, and feel.

WebCenter Spaces provides a default selection of schemes and scheme background colors, which you can use to create an instant look and feel. Additionally, you can select a custom scheme, which enables you to provide your own background image.

See Also:

For illustrations and descriptions of seeded page schemes and styles, see Table 5-1, "Seeded Page Schemes" and Table 5-2, "Seeded Page Styles".

After you create a page, you can enhance its original style and scheme with page layout components. The default layout components available through the Oracle Composer Catalog include the following:

  • Box—A container that provides controls for content rearrangement and orientation, including horizontal, vertical, scroll, and stretch and for creating additional boxes

    The Box is the landing site for all content added from the Oracle Composer Catalog. It is the component into which you can drag task flows, portlets, and Movable Boxes. Add a Box to provide additional content areas with different orientations (set one box to align its content horizontally and another to align vertically). For more information, see Section 6.5.1.1, "The Box Layout Component."

  • HTML Markup—A simple editor for entering a brief bit of HTML mark-up, JavaScript, text, or Expression Language (EL)

    Add HTML Markup to place static or dynamic markup language on the current page. For example, use the HTML Markup layout component to add a YouTube video, a Google Gadget, a Pandora Music station, and the like. For more information, see Section 6.5.1.2, "The HTML Markup Layout Component."

  • Hyperlink—A link to a specified application page or external Web site

    Add a Hyperlink to provide convenient connections to related Web sites or application pages. For more information, see Section 6.5.1.3, "The Hyperlink Layout Component."

  • Image—An image with an optional hyperlink feature

    Add an Image to promote branding or simply to illustrate the page. For more information, see Section 6.5.1.4, "The Image Layout Component."

  • Movable Box—A content container that you can reposition along with all its content

    Add a Movable Box to enable more versatile page personalization options to your users. For more information, see Section 6.5.1.5, "The Movable Box Layout Component."

  • Text—A text box with an in-place HTML editor

    Add formatted text to welcome users to your page or provide a static display of useful information. For more information, see Section 6.5.1.6, "The Text Layout Component."

  • Web Page—A component for displaying another web page within the WebCenter Spaces context

    For more information, see Section 6.5.1.7, "The Web Page Layout Component."

Layout components include component properties, which you can use to configure a particular component instance. For example, use Box properties to set a Box's orientation (horizontal or vertical), rearrange its child components, or provide additional style information. Use Image properties to specify the URL to the image, the target the image should link to, and the way that target should open.

6.4.2 Changing the Page Scheme and Scheme Background Color

For any page on which you have sufficient permissions, you can change the scheme that was specified when the page was created. The Oracle Composer Page Properties dialog includes a Display Options tab, where properties related to the page scheme and scheme background color appear (Figure 6-20).

Figure 6-20 Display Options Tab in the Page Properties Dialog (WebCenter Spaces)

Display Options tab in the Page Properties dialog

In WebCenter Spaces, a scheme defines the background image for a given page. Choose from preseeded background images, or select Custom, and provide your own custom image. Scheme background color provides a base color that covers the full width and length of the page.

This section describes how to change a page's background color and image.

To change a page background color and image in a WebCenter Spaces application:

  1. Log in, and go to the page where you want to change page schemes.

  2. Select Edit Page from the Page Actions menu (Figure 6-21).

    Figure 6-21 Edit Page Command on the Page Actions Menu

    Edit Page command on Page Actions menu

    The page opens in Oracle Composer.

  3. In Oracle Composer, click the Page Properties button (Figure 6-22).

    Figure 6-22 Page Properties Button in Oracle Composer

    Page Properties button in Oracle Composer

  4. If necessary, in the Page Properties dialog click the Display Options tab to bring it forward (Figure 6-23).

    Figure 6-23 Display Options Tab in the Page Properties Dialog (WebCenter Spaces)

    Display Options tab in the Page Properties dialog

    From the Scheme pick list, select a page scheme.

    For a list and illustrations of out-of-the-box page schemes in WebCenter Spaces, see Table 5-1, "Seeded Page Schemes".

  5. Select a page background color from the Scheme Background Color pick list (Figure 6-24).

    Figure 6-24 Scheme Background Color Pick List

    Scheme Background Color pick list

  6. Click OK to apply your changes and close the dialog.

  7. In Oracle Composer, click the Save button to save your changes (Figure 6-25)

    Figure 6-25 The Save Button

    Save button

    The page refreshes, displaying the new background color and image.

  8. Click the Close button to exit Oracle Composer (Figure 6-26).

    Figure 6-26 The Close Button

    Close button in Oracle Composer

6.4.3 Changing Everyone's Page Layout

Many of the page styles presented in the Create Page dialog can be switched to a different page style at application runtime. Other page styles expose external content, notably the Web Page page style, and consequently do not support mid-stream layout changes.

See Also:

Table 5-2, "Seeded Page Styles" illustrates WebCenter default page layouts and indicates which can be switched to a different layout.

Depending on how your application is configured, you may be able to switch page layouts in page view mode and in page edit mode. Switching a page layout in page view mode is a personalization that affects only your view of a page (for more information, see Section 3.3.2, "Changing Your Page Layout"). Switching page layout in page edit mode is a customization. This section describes how to switch a page layout in page edit mode. It includes the following subsections:

See Also:

For information about personalization and customization, see Section 7.2, "Customizing and Personalizing Page Content."

Note:

When you encounter errors in page edit mode, you can recover by closing your browser and then reopening it and relogging in to the application instance.

6.4.3.1 Switching Everyone's Page Layout Using Change Layout

To switch from one page layout to another:

  1. Log in, and go to the page where you want to revise a page layout.

  2. From the Page Actions menu, select Edit Page to open Oracle Composer (Figure 6-27).

    Figure 6-27 Edit Page Command on the Page Actions Menu

    Edit Page command on Page Actions menu

    Tip:

    If the Edit Page command is not available on the Page Actions menu or the Page Actions menu does not appear, it is likely that you do not have sufficient page access privileges. If this is the case, ask your application administrator for the privilege to edit pages. See Section 2.7, "Contacting Your Application Administrator."

  3. Scroll to the top-right of the page area, and click the Change Layout link.

    The layout picker opens (Figure 6-28).

    Figure 6-28 The Layout Picker

    Layout picker
    Description of "Figure 6-28 The Layout Picker"

  4. Click a layout to apply it to the currently displayed page.

    The page refreshes instantly, now arranged according to the selected layout.

  5. In Oracle Composer, click Save and then Close.

See Also:

For information about changing a page layout in only your view of a page, see Section 3.3.2, "Changing Your Page Layout."

For information about making the Change Layout link available in page view mode, see Section 6.5.3.9.3, "Working with Change Layout/Layout Customizable Properties."

6.4.3.2 Switching Everyone's Page Layout Using Add Box Icons

You can add additional content regions to a page by splitting existing layout Boxes. This section describes how.

To split a Box:

  1. Log in, and go to the page where you want to revise a page layout.

  2. From the Page Actions menu, select Edit Page to open Oracle Composer (Figure 6-29).

    Figure 6-29 Edit Page Command on the Page Actions Menu

    Edit Page command on Page Actions menu

    Tip:

    If the Edit Page command is not available on the Page Actions menu or the Page Actions menu does not appear, it is likely that you do not have sufficient page access privileges. If this is the case, ask your application administrator for the privilege to edit pages. See Section 2.7, "Contacting Your Application Administrator."

  3. Go to the layout Box you want to split, and click the Add Box icon that splits the Box in the manner you prefer (Figure 6-30).

    Figure 6-30 Add Box Icons

    Add Box icons

    Choose from:

    • Add Box Above

    • Add Box Below

    • Add Box Left

    • Add Box Right

  4. In Oracle Composer, click Save and then Close.

See Also:

For more information, see Section 6.5.1.1, "The Box Layout Component."

6.5 Working with Page Layout Components

You can use page layout components to add more content layout areas, images, links, and text, and expose external Web pages within the context of your WebCenter application. This section describes WebCenter default layout components, steps you through adding them to a page, and provides information about each component's properties. It contains the following subsections:

6.5.1 What You Should Know About Page Layout Components

Oracle Composer provides the following useful and versatile layout components:

6.5.1.1 The Box Layout Component

The Box layout component is a container that enables the placement of content on a WebCenter application page. Boxes are the landing place for the Movable Boxes and task flows that you add to a page.

In Oracle Composer, a Box is rendered as rectangle comprised of dashed lines, an Add Content button, and Add Box, Edit, and Delete icons (Figure 6-31).

Figure 6-31 A Box Layout Component on a Page in Edit Mode

Box layout component on a page

You can place content within a Box, and you can place one or more Boxes within a Box. You can configure Box properties to display content horizontally or vertically. You can specify the display of a scrollbar or set the Box to devote all its area to a single task flow. You can use Box controls to add boxes above, below, or to either side of a given Box.

The Box layout component provides access to style properties for setting font, color, and background on a single component instance. Style property values override such values set on the Box component's container, on the page, and on the application. For information about layout component Style properties, see Section 7.5.6, "Working with Style and Content Style Properties."

See Also:

For information about properties specific to the Box layout component, see Section 6.5.3.2, "Working with Box Layout Component Properties."

For information about adding layout components to a page, see Section 6.5.2, "Adding a Layout Component to a Page."

6.5.1.2 The HTML Markup Layout Component

The HTML Markup layout component is a simple text editor that enables the entry of text, HTML markup, JavaScript, and Expression Language (EL) expressions (Figure 6-32).

Figure 6-32 An HTML Markup Layout Component

HTML Markup layout component

Enter content through the component's properties.

See Also:

For information about HTML Markup layout component properties, see Section 6.5.3.3, "Working with HTML Markup Layout Component Properties."

For information about layout component Style properties, see Section 7.5.6, "Working with Style and Content Style Properties." For information about adding layout components to a page, see Section 6.5.2, "Adding a Layout Component to a Page."

For an example of how to use the HTML Markup layout component to embed video, music, slides, or Google Gadgets, see Section 7.1.6, "Embedding Video, Music, Slides, and Other Types of Content."

6.5.1.3 The Hyperlink Layout Component

A Hyperlink layout component (Figure 6-33) is comprised of two elements: a link title and a link destination.

Figure 6-33 A Hyperlink Layout Component

Edit icon on a Hyperlink layout component

The title provides the link text, and the destination provides the link target, that is, the URL to the target destination. Enter the link title and destination through Hyperlink properties. For information about Hyperlink properties, see Section 6.5.3.4, "Working with Hyperlink Layout Component Properties."

You can use internal and external link targets for a Hyperlink. For an internal target, you can use a relative directory path. An easy way to obtain the relative directory path of a WebCenter Spaces page is to navigate to the target page and go through the motions of adding it as a Favorite. By default, the Add Favorite dialog provides the relative URL of the current page. Simply copy this information, and use it to define the Hyperlink target.

See Also:

For information about adding a Favorite to WebCenter Spaces, see Section 3.5.2, "Adding Favorites."

The Hyperlink layout component provides access to style properties for setting font, color, and background properties on a single component instance. Style property values override such values set on the Hyperlink component's container, on the page, and on the application.

See Also:

For information about layout component Style properties, see Section 7.5.6, "Working with Style and Content Style Properties."

For information about adding layout components to a page, see Section 6.5.2, "Adding a Layout Component to a Page."

6.5.1.4 The Image Layout Component

Images can be added from two places in the Oracle Composer Catalog panel:

  • Image layout components from the Layout folder

  • Image files from Documents folder

Unlike images from the Documents folder, Images from the Layout folder provide controls for associating a link target with the image. Additionally, while image files can be discovered in a search, Image layout components cannot, preventing a return of irrelevant search results.

See Also:

For more information about images from the Documents folder, see Section 7.1.3, "Adding Documents to a Page."

Use the Image layout component (Figure 6-34) to promote company branding or simply to illustrate your application pages. Use any Web-compatible image from any publicly-accessible location.

Figure 6-34 Undefined Image Layout Component

Undefined Image layout component

The Image layout component includes properties for defining not only the image, but also an optional target URL and short- (ALT text) and long-description (external HTML file) text to enhance application accessibility. Target frame options are provided to enable you to define open behavior for the Image's link target. For information about properties specific to the Image layout component, see Section 6.5.3.5, "Working with Image Layout Component Properties."

The Image layout component provides access to style properties for setting font, color, and background properties on a single component instance. Style property values override such values set on the Image component's container, on the page, and on the application.

See Also:

For information about layout component Style properties, see Section 7.5.6, "Working with Style and Content Style Properties."

For information about adding layout components to a page, see Section 6.5.2, "Adding a Layout Component to a Page."

6.5.1.5 The Movable Box Layout Component

The Movable Box layout component (Figure 6-35) is like the Box layout component in that it is a container for page content; but it differs from a Box through its capacity to be dragged—content and all—to new positions on a page and to be resized in page view mode.

Figure 6-35 Movable Box Layout Component

Movable Box layout component

As the name implies, when you personalize or customize a page you can move a Movable Box along with all of its content. In contrast, you can move the content of a Box layout component, but you cannot move the Box itself. Another difference lies with the properties associated with each box type. For example, although a Box layout component provides controls for orienting box content horizontally or vertically, such properties are not provided with the Movable Box.

You can display a Movable Box with a header and borders. You can also turn these off through component properties (for more information, see Section 6.5.3.6, "Working with Movable Box Layout Component Properties"). When you expose the header, you can also select to hide or show additional actions on the Movable Box. These include move up or down, collapse and restore, remove, and resize.

The Movable Box layout component provides access to style properties for setting font, color, and background properties on a single component instance. Style property values override such values set on the Movable Box component's container, on the page, and on the application.

Tip:

Avoid adding a portlet to a Movable Box layout component. Adding a portlet to a Movable Box creates an unnecessary and potentially error-prone redundancy.

For more information, see Section 6.5.1.5, "The Movable Box Layout Component."

See Also:

For information about layout component style properties, see Section 7.5.6, "Working with Style and Content Style Properties."

For information about adding layout components to a page, see Section 6.5.2, "Adding a Layout Component to a Page."

6.5.1.6 The Text Layout Component

The Text layout component provides a convenient way to add static display text and HTML to a WebCenter Spaces page (Figure 6-36).

Figure 6-36 A Text Layout Component

Text layout component

The Text layout component provides a Rich Text Editor (RTE), which you can use to enter text, apply text styles, and add links and images (Figure 6-37).

Figure 6-37 Text Layout Component's Rich Text Editor

Text layout component’s Rich Text Editor

Note:

The RTE ignores the following types of tags because they are irrelevant or redundant within the RTE context:

  • script tags

  • form elements, such as input, select, textarea, and form

  • frame/frameset

  • document tags, such as html, head, body, meta, and title

  • unknown tags, for example, <foo></foo>

RTE controls are shown in Oracle Composer and are hidden in page view mode.

The Text layout component provides access to style properties for setting font, color, and background properties on a single component instance. Style property values override such values set on the Text component's container, on the page, and on the application.

See Also:

For information about layout component style properties, see Section 7.5.6, "Working with Style and Content Style Properties."

For information about properties specific to the Text layout component, see Section 6.5.3.7, "Working with Text Layout Component Properties."

For information about using RTE controls, see Table 15-4, "Rich Text Editor Controls".

For information about adding layout components to a page, see Section 6.5.2, "Adding a Layout Component to a Page."

6.5.1.7 The Web Page Layout Component

The Web Page layout component provides a means of displaying a window onto other web pages within the context of a WebCenter application page (Figure 6-38).

Figure 6-38 An Undefined Web Page Layout Component

Undefined Web Page layout component

Use the Web Page layout component to expose web content within the context of a WebCenter application page. All of the controls displayed in the web page are functional, enabling you to, for example, control video volume, edit the wiki, or post an entry to the blog.

You can use internal and external link targets for a Web Page. For an internal target, you can use a relative directory path. In WebCenter Spaces, an easy way to obtain the relative directory path of an application page is to navigate to the target page and go through the motions of adding it as a Favorite. By default, the Add Favorite dialog provides the relative URL of the current page. Simply copy this information, and use it to define the Web Page target.

See Also:

For information about adding a Favorite to WebCenter Spaces, see Section 3.5.2, "Adding Favorites."

The Web Page layout component provides a variation on the Web Page page style offered through the Create Page dialog. The Web Page page style is useful for offering the full external Web page experience. In contrast, the Web Page layout component is useful for including Web page content along with other content types on an application page.

The Web Page layout component provides access to style properties for setting font, color, and background properties on a single component instance. Use the Width and Height Style properties to determine the size of the Web Page display area. Style property values override such values set on the Web Page component's container, on the page, and on the application.

See Also:

For information about layout component style properties, see Section 7.5.6, "Working with Style and Content Style Properties."

For information about properties specific to the Web Page layout component, see Section 6.5.3.8, "Working with Web Page Layout Component Properties."

For information about adding layout components to a page, see Section 6.5.2, "Adding a Layout Component to a Page."

6.5.1.8 Hidden Layout Components

Some page layout components are not exposed for use in the Oracle Composer Catalog. They are nonetheless on view and configurable when you edit a page and set Oracle Composer to Source view.

Such components include:

  • panelStretchLayout—Provides a means of arranging content in defined areas on a page. Useful useful for enabling content to stretch when the browser is resized.

  • panelGroupLayout—Provides a means of arranging a series of child components vertically or horizontally (no wrapping), or consecutively (wrapping). The Layout property determines the arrangement of the child components.

  • Layout Customizable/Change Layout

    Provides a means of switching the current page style to another style. Not all page styles can be switched at runtime. For information about seeded page styles that can and cannot be switched, see Table 5-2.

  • spacer—Provides a means of incorporating some blank space in pages so that the page appears less cluttered than it would if all the components were presented immediately next to each other or immediately below each other.

See Also:

For information about setting component properties, see Section 6.5.3, "Working with Layout Component Properties."

For information about hidden-component properties, see Section 6.5.3.9, "Working with Hidden Layout Component Properties."

6.5.2 Adding a Layout Component to a Page

The process of adding a layout component to a page is the same for every layout component. This section describes how.

Note:

When you add a component to a page, you must wait for the application status indicator to finish processing before taking additional action.

Tip:

Although you cannot add hidden layout components to a page—they are provided with the page infrastructure—you can configure hidden layout component properties. For more information, see Section 6.5.3.9, "Working with Hidden Layout Component Properties."

To add a layout component to a page:

  1. Log in, and go to the page where you want to add a layout component.

  2. In WebCenter Spaces, select Edit Page from the Page Actions menu to open Oracle Composer (Figure 6-39).

    Figure 6-39 Edit Page Command on the Page Actions Menu

    Edit Page command on Page Actions menu

    Tip:

    If the Edit Page command is not available on the Page Actions menu or the Page Actions menu does not appear, it is likely that you do not have sufficient page access privileges. If this is the case, ask your application administrator for the privilege to edit pages.

    For more information, see Section 2.7, "Contacting Your Application Administrator."

  3. Click the Add Content button in the content area where you want to place the layout component (Figure 6-40).

    Figure 6-40 The Add Content Button in Oracle Composer

    Add Content button in Oracle Composer

    The Oracle Composer Catalog opens (Figure 6-41).

    Figure 6-41 Oracle Composer Catalog

    Oracle Composer Catalog

    Note:

    In WebCenter Spaces, the content of the Catalog varies according to the services that are integrated with the application and the location from which the Catalog was opened. For example, the components that appear in the Catalog when you open it from a personal space differ from those that appear when you open it from a group space.

  4. In WebCenter Spaces, click the Open link next to Layout (Figure 6-41) to display a selection of layout components (Figure 6-42).

    In custom WebCenter applications, click the Open link next to ADF Faces Components to display a selection of layout components.

    Figure 6-42 Layout Components in the Oracle Composer Catalog

    Layout components in the Oracle Composer Catalog

  5. Click the Add link next to the component you want to add to the page.

    By default, new components are added to the top of their content areas.

  6. Click the Close button to exit the Catalog.

  7. Optionally, drag-and-drop the newly-added component to the desired position on the page.

    As you move a component around, a dark box marks the target drop location.

  8. In Oracle Composer, click the Save button to save your changes.

  9. Optionally, click the Close button to exit Oracle Composer.

6.5.3 Working with Layout Component Properties

Each layout component has associated properties that you can use to refine the appearance and behavior of a layout component instance. This section provides information about accessing and providing values for layout component properties. It contains the following subsections:

6.5.3.1 Setting Properties on a Layout Component

Layout components have associated properties, which users with sufficient privileges can access from the Oracle Composer Component Properties dialog.

Note:

When you enter most types of property values in the Component Properties dialog and then click Apply, the dialog remains open. With values other than expected value types, the dialog closes, and the page is refreshed to reflect the new value.

Expected values types include a string or an array of strings, where the component expects a value of type java.lang.String[], and primitive values, such as integer, Boolean, float, double, and short.

There are two ways to access the Component Properties dialog: through Oracle Composer Design view and Oracle Composer Source view. This section describes both methods. It contains the following subsections:

Note:

When you encounter errors in page edit mode, you can recover by closing your browser and then reopening it and relogging in to the application instance.
6.5.3.1.1 Setting Layout Component Properties in Design View

To set layout components properties in Design view:

  1. Log in, and go to the page where you want to set properties on a layout component.

  2. In WebCenter Spaces, select Edit Page from the Page Actions menu to open Oracle Composer (Figure 6-43).

    Figure 6-43 Edit Page Command on the Page Actions Menu

    Edit Page command on Page Actions menu

    Tip:

    If the Edit Page command is not available on the Page Actions menu or the Page Actions menu does not appear, it is likely that you do not have sufficient page access privileges. If this is the case, ask your application administrator for the privilege to edit pages. \

    For more information, see Section 2.7, "Contacting Your Application Administrator."

  3. Click the Edit icon (Figure 6-44) on the layout component of interest to open the Component Properties dialog.

    Figure 6-44 Edit Icon on a Layout Component

    Edit icon on a layout component

  4. Edit component properties, and click OK when you have finished.

    Enter Parameter and Display Option values either unwrapped or wrapped in Expression Language syntax, for example, value or #{value}. If you enter value, Oracle Composer automatically wraps it in EL syntax when you save your changes.

See Also:

For detailed information about layout component properties, see Section 6.5.3, "Working with Layout Component Properties."

For detailed information about commonly-shared properties, see Section 7.5, "Setting Properties on Page Content."

6.5.3.1.2 Setting Layout Component Properties in Source View

To set layout component properties in Source view:

  1. Log in, and go to the page where you want to set properties on a layout component.

  2. From the Page Actions menu, select Edit Page to open Oracle Composer (Figure 6-45).

    Figure 6-45 Edit Page Command on the Page Actions Menu

    Edit Page command on Page Actions menu

    Tip:

    If the Edit Page command is not available on the Page Actions menu or the Page Actions menu does not appear, it is likely that you do not have sufficient page access privileges. If this is the case, ask your application administrator for the privilege to edit pages.

    For more information, see Section 2.7, "Contacting Your Application Administrator."

  3. From the View menu, select Source (Figure 6-53).

    Figure 6-46 The Source Option on the View Menu in Oracle Composer

    Source option on the View menu in Oracle Composer

  4. In the list of components, click the component with properties you want to configure.

    Notice that the component itself is highlighted with a blue outline (Figure 6-47).

    Figure 6-47 Selecting a Component in the Component Hierarchy

    Selecting a component in the hierarchy

  5. Click the Edit icon in the Source view header (Figure 6-48) to open the Component Properties dialog.

    Figure 6-48 Edit Icon on Source View Header

    Edit icon on Source view header

  6. Edit component properties, and click OK when you have finished.

    Enter Parameter and Display Option values either unwrapped or wrapped in Expression Language syntax, for example, value or #{value}. If you enter value, Oracle Composer automatically wraps it in EL syntax when you save your changes.

6.5.3.2 Working with Box Layout Component Properties

Box layout component properties provide a means of enabling or disabling the display of an Actions menu, specifying the orientation of Box content (vertical, horizontal, scroll, stretch), rearranging Box components, and providing ALT text on the Box.

See Also:

For information about the Box layout component, see Section 6.5.1.1, "The Box Layout Component."

For information about setting Box layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-1 lists and describes Box layout component display options.

Table 6-1 Box Layout Component Display Options

Property Description

Allow Action

Options for enabling or disabling the display of various actions on the Box and on the components you add to the box

Choose from:

  • all—Show the Add Content button on the Box, show the Add Box icons, display the Actions menu on all Box child components that support it, and allow the movement of Movable Boxes into and out of the Box.

  • none—Hide the Add Content button on the Box, hide the Add Box icons, and disable the display of the Actions menu on all Box child components. Additionally, any Movable Boxes inside the Box are frozen and cannot be moved; and users cannot move Movable Boxes into the Box.

Layout

A means of specifying the orientation of Box content

Choose from:

  • vertical—Align box content in a vertical orientation (that is, as a column of objects).

  • horizontal—Align box content in a horizontal orientation (that is, as a row of objects).

  • scroll—Align Box content vertically with a scrollbar. The scrollbar is rendered when the height/width of its content exceeds the Box's height or width.

  • stretch—The Box stretches to accommodate the full display of one component. When you select stretch, the Add Content button is hidden after one component is added to the box and users are restricted from dragging and dropping content into the Box. Additionally, you cannot split a Box that is being stretched.

Short Desc

A field for entering ALT text for the box

ALT text appears as a tooltip when users roll their mouse pointers over the box.

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, any child components are also hidden. You can show the component again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

Tip:

Display Options properties additionally provide access to an Expression Language (EL) editor, which you can use to enter and test EL values for Display Options properties.

For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

Box layout component properties include a Child Components tab with options for hiding, showing, and rearranging the Box content (Figure 6-49).

Figure 6-49 Child Components Tab in Box Component Properties Dialog

Child Components tab in Box Component Properties dialog

Tip:

Once you hide a component using Box properties, you can show it again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

Box layout component properties include a Style tab with options for overriding the styles set on the Box's parent container, the current page, and the application. Box style properties are common to many other components, and are listed and described in Section 7.5.6, "Working with Style and Content Style Properties."

6.5.3.3 Working with HTML Markup Layout Component Properties

HTML Markup layout component properties provide a means of entering a brief bit of HTML mark-up, JavaScript, text, or Expression Language (EL). For example, use the HTML Markup layout component to embed a YouTube video, Google Gadget, or Pandora Music Station (for more information, see Section 7.1.6, "Embedding Video, Music, Slides, and Other Types of Content").

In addition to content entry, use the controls on the Display Options tab to specify text entry behavior and apply ALT text.

See Also:

For information about the HTML Markup layout component, see Section 6.5.1.2, "The HTML Markup Layout Component."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-2 lists and describes HTML Markup layout component Display Options.

Table 6-2 HTML Markup Layout Component Display Options

Property Description

Escape

A check box for enabling or disabling literal evaluation of special characters

  • Checked (true) enables literal evaluation of such characters as angle brackets (<|>) and HTML special characters. For example, when a user enters &#8212; it is rendered as &#8212;.

  • Cleared (false) disables literal interpretation of special characters. For example, when a user enters &#8212;, it is rendered as —. False is the default value.

No Wrap

A check box for enabling or disabling text wrapping

  • Checked (true) disables text wrapping. Users must enter line breaks manually.

  • Cleared (false) enables text wrapping. Lines wrap in accordance with the component width. False is the default value.

Short Desc

A field for entering ALT text for the HTML Markup layout component

When users roll their mouse pointers over the component, this text appears as a tooltip.

Value

A field for specifying the content that this component renders

In addition to text, this parameter also accepts Expression Language (EL) expressions. For example:

#{bean.value}

After you save your changes and close the page editor, the HTML Markup component shows the evaluated value of the specified EL. For information about Expression Language expressions, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, any child components are also hidden. You can show the component again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

Tip:

Display Options properties additionally provide access to an Expression Language (EL) editor, which you can use to enter and test EL values for Display Options properties.

For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

HTML Markup layout component properties include a Style tab with options for overriding the styles set on the layout component's parent container, the current page, and the application. HTML Markup style properties are common to many other components, and are listed and described in Section 7.5.6, "Working with Style and Content Style Properties."

6.5.3.4 Working with Hyperlink Layout Component Properties

Hyperlink layout component properties provide a means of specifying link text, target destination, and open behavior.

See Also:

For information about the Hyperlink layout component, see Section 6.5.1.3, "The Hyperlink Layout Component."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-3 lists and describes Hyperlink layout component display options.

Table 6-3 Hyperlink Layout Component Display Options

Property Description

Title

A field for specifying hyperlink text

Enter the word or phrase you want to use as link text.

Destination

A field for entering the hyperlink target URL

Enter the Web address of the page you want to link to.

Open in a new window

Option for determining link target open behavior

  • Checked (true) means the link target should open in a new browser tab or window.

  • Cleared (false) means the link target should open in the current browser tab or window.

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, any child components are also hidden. You can show the component again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

Tip:

Display Options properties additionally provide access to an Expression Language (EL) editor, which you can use to enter and test EL values for Display Options properties.

For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

Hyperlink layout component properties include a Style tab with options for overriding the styles set on the layout component's parent container, the current page, and the application. Hyperlink style properties are common to many other components, and are listed and described in Section 7.5.6, "Working with Style and Content Style Properties."

6.5.3.5 Working with Image Layout Component Properties

Image layout component properties provide a means of specifying the location of the image file, an optional hyperlink target, ALT text and a long description of the image, and a target frame for the hyperlink.

See Also:

For information about the Image layout component, see Section 6.5.1.4, "The Image Layout Component."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-4 lists and describes Image layout component display options.

Table 6-4 Image Layout Component Properties

Property Description

Destination URI

A URL for the Image link target destination

For your link target, you can use URLs that are internal or external to the application.

WebCenter Spaces only: For an internal target, that is, for a WebCenter Spaces page, you can use a directory path relative to the application root directory.

Image Source

The URL to the image file

Use any Web-compatible image from any internal or publicly-accessible location.

Long Desc URL

A URL to a file

Typically, a long description link opens a file that provides a full description of the Image when ALT text is not sufficiently descriptive. But you can use this parameter to link to any file.

Short Desc

Image ALT text

ALT text appears as a tooltip when users roll their mouse pointers over the image.

Target Frame

Open behavior for the link target

Enter any standard browser target, such as:

  • _top—Loads the link target in the current browser window (as opposed to the current frame)

  • _parent—Loads the link target in the parent frame of the current frame.

  • _self—Loads the link target within the same frame as the frame containing the link.

  • _blank—Loads the link target in a new browser tab or window, leaving the original page open.

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, any child components are also hidden. You can show the component again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

Tip:

Display Options properties additionally provide access to an Expression Language (EL) editor, which you can use to enter and test EL values for Display Options properties.

For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

Image layout component properties include a Style tab with options for overriding the styles set on the layout component's parent container, the current page, and the application. Image style properties are common to many other components, and are listed and described in Section 7.5.6, "Working with Style and Content Style Properties."

6.5.3.6 Working with Movable Box Layout Component Properties

Movable Box layout component properties provide a means of specifying the appearance and behavior of a Movable Box.

See Also:

For information about the Movable Box layout component, see Section 6.5.1.5, "The Movable Box Layout Component."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-5 lists and describes the Movable Box layout component display options.

Table 6-5 Movable Box Layout Component Display Options

Property Description

Background

Select from light, medium, or dark to specify a shade of color for the component background.

Display Actions

Specify how to display actions on the component instance. Actions include the Remove icon, the Actions menu icon, and the Resizer.

Choose from:

  • Always—Always display actions on the component header.

  • onHover—Display actions when users hover their mouse pointers over the component header.

Display Header must be selected for these options to fully apply. If a header is not shown:

  • In page view mode:

    • always—only the Resizer is shown.

    • onHover—the Resizer is shown only when users hover their mouse pointers over the component.

  • In page edit mode:

    • always—All actions except the Resizer display on a floating palette. All actions display only when users hover their mouse pointers over the component.

    • onHover—Only the Resizer is shown when users hover their mouse pointers over the component.

Display Header

Select this check box to display a header on the Movable Box. A header is depicted in the following graphic.

Header on a Movable Box

Display Shadow

Select to display a drop-shadow behind the component instance.

Short Desc

Provide ALT text for the component instance. When users roll their mouse pointers over the component instance, the text you enter here pops up.

Show Minimize Action

Select whether to display the minimize action on the component header (that is, a Collapse icon on the component chrome). Choose from:

  • none—Do not display the Collapse icon.

  • chrome—Display the Collapse icon on the component header.

Collapse icon

Show Move Action

Select whether to display Move Up and Move Down commands on the component Actions menu. Choose from:

  • none—Do not display Move commands on the Actions menu.

  • menu—Display Move commands on the Actions menu.

Move Up/Move Down commands on box header

On a Movable Box, the Actions menu icon displays only when components are located above or below the Movable Box.

Show Remove Action

Select whether to display the Remove icon on the component header (that is, the component chrome). Choose from:

  • none—Do not display the Remove icon in the component header in page view mode. In page edit mode, this icon always appears. none is the default value.

  • chrome—Display the Remove icon on the component header in page view mode.

Remove icon on a Movable Box header

Note that after you select to remove a component in this way, you can restore it using these methods:

  • Exit page edit mode without saving.

  • Select the Reset Layout command from the Page Actions menu. Reset Layout removes all page personalizations, so any component removed during a page personalization is restored (for more information, seeSection 3.4, "Removing Your Page Personalizations").

  • Edit the page, and add another component instance.

Show Resizer

Select whether to display a window resizer on a component instance. The window resizer enables you to increase the component height. Choose from:

  • always—Always display the window resizer.

  • never—Never display the window resizer.

Window resizer

Stretch Content

Select to stretch the content to fill the container. For example, all task flows and portlets are wrapped in a container. If you change the height of the container, through the Content Style Height property, Stretch Content specifies that the task flow or portlet should be stretched to fill the specified height.

Content always takes up the full width of its parent container.

Text

By default, this value is Movable Box. Use this property to specify another display name for the box. The value you provide here appears in the box header. If you select to hide the box header, the Text value is ignored.

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, any child components are also hidden. You can show the component again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

Tip:

Display Options properties additionally provide access to an Expression Language (EL) editor, which you can use to enter and test EL values for Display Options properties.

For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

Movable Box layout component properties include style tabs with options for overriding the styles set on the layout component's parent container, the current page, and the application. Movable Box style properties are common to many other components, and are listed and described in Section 7.5.6, "Working with Style and Content Style Properties."

6.5.3.7 Working with Text Layout Component Properties

Text layout component properties provide a means of specifying the appearance and behavior of a Text layout component.

See Also:

For information about the Text layout component, see Section 6.5.1.6, "The Text Layout Component."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Text layout component properties include the same options as provided for a Movable Box layout component. For more information, see Table 6-5, "Movable Box Layout Component Display Options".

Tip:

Display Options properties additionally provide access to an Expression Language (EL) editor, which you can use to enter and test EL values for Display Options properties.

For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

Text layout component properties include style tabs with options for overriding the styles set on the layout component's parent container, the current page, and the application. Text style properties are common to many other components, and are listed and described in Section 7.5.6, "Working with Style and Content Style Properties."

6.5.3.8 Working with Web Page Layout Component Properties

Web Page layout component properties provide a means of specifying the URL of the content to render in the Web Page area and the ALT text to display when users roll their mouse pointers over the component border.

See Also:

For information about the Web Page layout component, see Section 6.5.1.7, "The Web Page Layout Component."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-6 lists and describes Web Page layout component display options.

Table 6-6 Web Page Layout Component Display Options

Property Description

Short Desc

A field for entering ALT text for the Web Page area

Note that, for the Web Page component, the ALT text appears only when users hover their mouse pointers over the component border. You can improve the ease of this occurrence by increasing, for example, the padding around the component using the Other CSS property on the Component Properties Style tab. For example, you can enter the following in the Other CSS text box:

padding-top:30px;

Source

A field for entering the fully qualified URL to the source Web content to render in the Web Page area

For example:

http://www.oracle.com

Note that www.oracle.com (that is, without http://) does not qualify. If a given URL is invalid, your content does not render within the Web Page layout component.

You can also open a window onto a wiki or a blog through this property. For more information, see Chapter 27, "Working with Wikis and Blogs."

Note: Use the component's Style properties to adjust the width and height of the display area (for more information, see Section 7.5.6, "Working with Style and Content Style Properties.").

WebCenter Spaces only: If you plan to display the content of another WebCenter Spaces page, you can use a relative address. For more information, see Section 6.5.1.7, "The Web Page Layout Component."

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, any child components are also hidden. You can show the component again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

Tip:

Display Options properties additionally provide access to an Expression Language (EL) editor, which you can use to enter and test EL values for Display Options properties.

For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

Web Page layout component properties include a Style tab with options for overriding the styles set on the layout component's parent container, the current page, and the application. Web Page style properties are common to many other components, and are listed and described in Section 7.5.6, "Working with Style and Content Style Properties."

6.5.3.9 Working with Hidden Layout Component Properties

Some page layout components are not exposed for use in the Oracle Composer Catalog. They are nonetheless on view and configurable when you edit a page and set Oracle Composer to Source view (Figure 6-50).

Figure 6-50 Hidden Layout Components Exposed in Source View

Hidden layout components exposed in Source view

This section lists and describes the configurable properties associated with such components. It contains the following subsections:

6.5.3.9.1 Working with panelStretchLayout Properties

The panelStretchLayout component provides a means of arranging content in defined areas on a page. This component is useful for enabling content to stretch when the browser is resized.

The panelStretchLayout component's defined areas are called facets (Figure 6-51).

Figure 6-51 Facets of a panelStretchLayout Component

facets of a panelStretchLayout component

Note:

Figure 6-51 shows the facets when the language reading direction of the application is configured left-to-right. If instead the language direction is right-to-left, the start and end facets are switched.

Facets are controlled by the values you enter for its Display Options properties. When you set the height of the top and bottom facets, any contained components are stretched up to fit the height. Similarly, when you set the width of the start and end facets, any components contained in those facets are stretched to that width. If no components are placed in a facet, then the facet does not take up any space.

Enter values for component properties, or click the Edit icon next to a property to open a simple EL Editor, where you can select from prebuilt expressions or enter values manually. For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

See Also:

For information about the panelStretchLayout component, see Section 6.5.1.8, "Hidden Layout Components."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-7 lists and describes the panelStretchLayout properties that appear on the Display Options tab in the Component Properties dialog.

Note:

All panelStretchLayout height and width facets take the value auto; however, using auto slows page performance.

Table 6-7 panelStretchLayout Display Options

Property Description

Bottom Height

The height of the bottom facet. Use any standard CSS unit of measure, such as pt, px, pc, li, and so on.

Never express a Height value as a percentage. Because of differences between browsers and between layout containers, percentages do not work as you expect. If you want your component to take up 100% of a page, consider creating a page using the Stretch page style and adding the component to it.

End Width

The width of the end facet. Use any standard CSS unit of measure, such as pt, px, pc, li, and so on.

Short Desc

A field for entering ALT text for the component

ALT text appears as a tooltip when users roll their mouse pointers over the component.

Start Width

The width of the start facet. Use any standard CSS unit of measure, such as pt, px, pc, li, and so on.

Theme

The component style theme to apply to the children of this component. Use this property to change the theme without causing associated skin changes. Application skins are the sources of the themes. Some skins may have no themed definitions.

Enter one of:

  • dark

  • medium

  • light

No theme (none) is the default.

Top Height

The height of the top facet. Use any standard CSS unit of measure, such as pt, px, pc, li, and so on.

Never express a Height value as a percentage. Because of differences between browsers and between layout containers, percentages do not work as you expect. If you want your component to take up 100% of a page, consider creating a page using the Stretch page style and adding the component to it.

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, any child components are also hidden. You can show the component again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

6.5.3.9.2 Working with panelGroupLayout Properties

The panelGroupLayout component provides a means of arranging a series of child components vertically or horizontally (no wrapping), or consecutively (wrapping). The component's Layout property determines the arrangement of child components.

Enter values for component properties, or click the Edit icon next to a property to open a simple EL Editor, where you can select from prebuilt expressions or enter values manually. For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

See Also:

For information about the panelGroupLayout component, see Section 6.5.1.8, "Hidden Layout Components."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-8 lists and describes the panelGroupLayout properties that appear on the Display Options tab in the Component Properties dialog.

Table 6-8 panelGroupLayout Display Options

Property Description

Halign

A means of expressing the horizontal alignment of component content

Select one of:

  • start—align content horizontally, starting from the starting position

    This is either left or right depending on whether the current context is localized for a left-reading or right-reading language.

  • center—align content horizontally, starting from the center

  • end—align content horizontally, starting from the ending position

    This is either right or left depending on whether the current context is localized for a left-reading or right-reading language.

  • left—align content horizontally, starting from the left

  • right—align content horizontally, starting from the right

Layout

A means of specifying the orientation of component content

Choose from:

  • default—align content vertically.

  • horizontal—align content horizontally

  • vertical—align content vertically

  • scroll—align content vertically with a scrollbar

    The scrollbar is rendered when the height/width of its content exceeds the component height or width.

Short Desc

A field for entering ALT text for the component

ALT text appears as a tooltip when users roll their mouse pointers over the component.

Theme

The component style theme to apply to the children of this component. Use this property to change the theme without causing associated skin changes. Application skins are the sources of the themes. Some skins may have no themed definitions.

Enter one of:

  • dark

  • medium

  • light

No theme (none) is the default.

Valign

A means of expressing the vertical alignment of component content.

Select one of:

  • middle—content is placed in the middle of the parent component

  • top—content is placed at the top of the parent component

  • bottom—content is placed at the bottom of the parent component

  • baseline—content is placed on the baseline of the parent component

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, any child components are also hidden. You can show the component again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

Properties for the panelGroupLayout component include a Child Components tab with options for hiding, showing, and rearranging component content. For more information, see Section 6.5.3.2, "Working with Box Layout Component Properties."

6.5.3.9.3 Working with Change Layout/Layout Customizable Properties

The Layout Customizable component provides a means (through a Change Layout button or a link) of switching the current page style to another style. Not all page styles can be switched at runtime. For information about seeded page styles that can and cannot be switched at runtime, see Table 5-2.

See Also:

For information about the Change Layout/Layout Customizable component, see Section 6.5.1.8, "Hidden Layout Components."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-9 lists and describes the Layout Customizable properties that appear on the Layout Customizable Properties and Display Options tabs in the Component Properties dialog.

Enter values for component properties, or click the Edit icon next to a property to open a simple EL Editor, where you can select from prebuilt expressions or enter values manually. For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

Table 6-9 Layout Customizable Properties

Property Description

Layout Switcher

Layout switcher

Eight options for determining page layout

The current layout is highlighted with a dashed outline. Click another option to switch to its layout model.

Short Desc

A field for entering ALT text for the component

ALT text appears as a tooltip when users roll their mouse pointers over the component.

Show Icon

A check box for specifying that a Change Layout icon should appear on the page (checked)

Show Layout Changer

A check box for specifying whether to show or hide the Change Layout button or link in page view mode

The Change Layout button or link always displays in page edit mode.

Text

A means of revising the Change Layout button or link text

Enter text in the field provided.

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, any child components are also hidden. You can show the component again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

6.5.3.9.4 Working with spacer Properties

The spacer component provides a means of incorporating some blank space in pages so that the page appears less cluttered than it would if all the components were presented immediately next to each other or immediately below each other.

Enter values for component properties, or click the Edit icon next to a property to open a simple EL Editor, where you can select from prebuilt expressions or enter values manually. For more information, see Section 7.5.5, "Using Expression Language (EL) Expressions with Component Properties."

See Also:

For information about the panelStretchLayout component, see Section 6.5.1.8, "Hidden Layout Components."

For information about setting layout component properties, see Section 6.5.3.1, "Setting Properties on a Layout Component."

Table 6-10 lists and describes the spacer properties that appear on the Display Options tab in the Component Properties dialog.

Table 6-10 spacer Display Options

Property Description

Height

A field for specifying the spacer height

Use any standard CSS unit of measure, such as pt, px, pc, li, and so on.

Never express a Height value as a percentage. Because of differences between browsers and between layout containers, percentages do not work as you expect.

Short Desc

A field for entering ALT text for the component

ALT text appears as a tooltip when users roll their mouse pointers over the component.

Width

A field for specifying spacer width

Use any standard CSS unit of measure, such as pt, px, pc, li, %, and so on.

Show Component

An option for hiding or showing the component on the page

  • Select to show the component

  • Clear to hide the component

Once you hide a component in this way, you can show it again in Oracle Composer Source view. Right-click the hidden component, and select Show Component from the resulting context menu.

6.5.4 Deleting Layout Components

When you delete a layout component, such as a Box, all of the component's children—that is, anything contained in or hierarchically lower than the component—are also deleted. For example, if you delete a Box that contains multiple task flows, the Box and all of the task flow instances it contains are deleted.

Note:

You cannot recover deleted components unless they were seeded components included in the page style used when the page was created. For information about restoring a page to its seeded state, see Section 6.2.2, "Removing All Edits, Personalizations, and Customizations from a Page."

The controls for deleting a component are located on the component itself in Oracle Composer Design view and on the header of the list of components in Source view. This section describes how to delete layout components in both Design view and Source view. It contains the following subsections:

6.5.4.1 Deleting a Layout Component in Design View

To delete a layout component in Design view:

  1. Log in, and go to the page that contains the layout component you want to delete.

  2. From the Page Actions menu, select Edit Page to open the page in Oracle Composer.

    Tip:

    If the Edit Page command is not available on the Page Actions menu or the Page Actions menu does not appear, it is likely that you do not have sufficient page access privileges. If this is the case, ask your application administrator for the privilege to edit pages.

    For more information, see Section 2.7, "Contacting Your Application Administrator."

  3. If necessary, open the View menu and select Design.

  4. Click the Remove icon on the component header (Figure 6-52), or, if no header is shown, on the component's floating palette.

    Figure 6-52 Remove Icon on a Layout Component Header

    Remove icon on a layout component header

  5. Click the Delete button in the resulting delete confirmation dialog.

    The layout component is permanently removed from the page. If the layout component had any child components, such as an Image inside a Movable Box, those child components are deleted as well.

6.5.4.2 Deleting a Layout Component in Source View

To delete a layout component in Source view:

  1. Log in, and go to the page that contains the layout component you want to delete.

  2. From the Page Actions menu, select Edit Page to open Oracle Composer.

    Tip:

    If the Edit Page command is not available on the Page Actions menu or the Page Actions menu does not appear, it is likely that you do not have sufficient page access privileges. If this is the case, ask your application administrator for the privilege to edit pages.

    For more information, see Section 2.7, "Contacting Your Application Administrator."

  3. From the View menu, select Source (Figure 6-53).

    Figure 6-53 The Source Option on the View Menu in Oracle Composer

    Source option on the View menu in Oracle Composer

  4. In the list of components, click the component you want to delete.

    Notice that the component itself is highlighted with a blue outline (Figure 6-54).

    Figure 6-54 Selecting a Component in the Component Hierarchy

    Selecting a component in the hierarchy

  5. Click the Delete icon on the list header (Figure 6-55).

    Figure 6-55 Delete Icon on Source View Header

    Delete icon on Source view header

  6. Click the Delete button in the resulting delete confirmation dialog.

    The layout component is permanently removed from the page. If the layout component had any child components, such as an Image inside a Movable Box, those child components are deleted as well.

6.6 Using Pretty URLs for WebCenter Spaces Pages

A concise URL that shields users from the complexity of the real web address can be much more presentable and somewhat less daunting to users interested in navigating to your page. You can shield your users from complex application page URLs with pretty URLs.

Pretty URLs are much shorter versions of the URL you might copy from your browser address bar. With pretty URLs, you can navigate to pages directly, without having to know the internal URL. Additionally, pretty URLs enable you to send simpler, shorter URLs to your colleagues.

Table 6-11 lists and describes the syntax for the pretty URLs you can formulate for easy access to public and non-public pages.

Table 6-11 Syntax of Pretty URLs

Use Case Pretty URL Syntax

Take user to the home page of his or her personal space

http://host:port/webcenter/spaces/home

Take user to the personal page he or she last accessed

http://host:port/webcenter

http://host:port/webcenter/spaces

Take user to a specific page in a personal space

http://host:port/webcenter/spaces/page/escapedPageDisplayName

Take user to the specified group space, where the last-accessed page is displayed

http://host:port/webcenter/spaces/GroupSpaceName

Take user to the first page of a group space

http://host:port/webcenter/spaces/GroupSpaceName/home

Take user to a specific page in a group space

http://host:port/webcenter/spaces/GroupSpaceName/page/escapedPageDisplayName

Note:

In Table 6-11, wherever the variable GroupSpaceName is indicated, use the group space name in lieu of the group space display name. The group space name is the value entered for Group Space Name on the General tab of a group space Settings page. The group space display name appears on the group space top-level tab.

For example, when you create a group space with the name My Space, the URL to this group space ends with My_Space.

Wherever the variable escapedPageDisplayName is indicated, use an escaped version of the page display name.

For example, when you create a page with the name My Page, the URL to this page ends with My+Page.

In addition to providing pretty URLs, you can also pass parameter values through your application URLs. For one thing, this enables you to steer different users to the same page, which in turn provides tailor-made information depending on the URL you provided. For more information, see Section 8.5, "Passing Parameter Values Through the Page URL."

6.7 Deleting Pages

You have two options for deleting WebCenter Spaces pages:

For information about deleting a group space, see Section 11.7, "Deleting a Group Space." You cannot delete a personal space. Personal spaces are removed automatically when a user is removed from the identity store that provides users to your WebCenter Spaces application.