Understanding PeopleSoft Enterprise Portal Branding

This chapter discusses:

• Branding uses

• Branding components

• Items you can brand

• Branding methods

• Items you cannot brand

• Branding across remote nodes

Understanding Branding Uses

A brand is a trademark or distinctive name that identifies a product or a manufacturer. You can extend the concept of brand to create distinctive Web sites designs for your company. Oracle's PeopleSoft Enterprise Portal provides you with the ability to quickly implement a portal with your own "look and feel," or branding.

PeopleSoft Enterprise Portal ships with twelve predefined branding themes. You can use these themes as they are and apply your own images, text, links and more to match the needs of your audience. You can also create your own themes.

You can apply branding themes based on portal registry, site, or user role. PeopleSoft Enterprise Portal branding is useful for:

• Any portal that faces multiple audiences and requires a different look for each.

  You can use branding themes for your company's primary Web site by using a single portal database to present different user experiences and deliver centrally managed content appropriate for each user group.

  For example, a company can use branding to provide different user experiences for the general public, customers, suppliers, job applicants, prospective customers, and partners. A university system can use branding to provide different user experiences for campuses, students, faculty and alumni.

  The homepage header images and links can be different for each user group, thereby delivering an experience designed especially for their needs. For example, you could create a guest theme for public or general Web traffic, and then once a user logs on, the user's assigned role could drive a different theme.

• Reducing costs.

  PeopleSoft Enterprise Portal branding saves the development costs of creating separate Web sites and portals. PeopleSoft Enterprise Portal branding enables you to run one portal database and share a common IT infrastructure, and thereby enables you to save the development costs of creating separate Web sites and portals. You can support different themed experiences for user groups, thereby leveraging IT personal and hardware resources. Moreover, you can delegate theme creation and administration away from IT and development personnel to less-costly resources who better understand user populations and can configure and assign themes.

• Ensuring standardization among department intranet sites.

  Intranet sites likely need to follow general corporate design standards. With PeopleSoft Enterprise Portal branding, sites created with PeopleSoft Enterprise Portal Site Management can inherit a basic design, yet override key elements, such as logos and header links.

Understanding Branding Components

This section discusses the components and terminology used in PeopleSoft Enterprise Portal branding.

Stylesheets

The user homepage usually includes a header, footer, menu navigation pagelet, and a few homepage pagelets. There are several stylesheet references when the homepage is generated. They are applied in the following sequence:

1. Stylesheet specified for the homepage pagelets, if any of the displaying homepage pagelets is an iPage.

   This is set in the page properties in Application Designer.

2. Stylesheet defined in the Define Menu Styles component, if the PeopleSoft Enterprise Menu pagelet is on the homepage.

3. Stylesheet defined for the PeopleTools standard header.

4. Stylesheet defined in the theme definition.

You can have conflicting style classes within all of these stylesheets used in the template. For example, if you have a style class named MY_STYLE_CLASS in the first stylesheet and also have a style class named MY_STYLE_CLASS in the fourth stylesheet, there may be conflicting styles in the resulting homepage. Because the conflicting styles are defined at the same level, the one applied later in the sequence takes precedence.

In the homepage template, the stylesheet specified in the branding theme definition always takes precedence over competing stylesheets. For example, PSPAGE in the stylesheet EPPSTYLEDEF includes two pixels for the left margin. To override the left margin, PSPAGE is included in the blue theme stylesheet EPPBRBLUESTYLEDEF, but the left margin has been changed to zero.

You can also have conflicting styles in your target content template. In a page-based template, the stylesheet associated with the page used for the target content always takes precedence over competing stylesheets. In a frame-based template, the stylesheet specified in each frame takes precedence for the content within the frame.

In addition to the specifics mentioned here, all the rules of inheritance and conflicting styles of cascading stylesheets still apply. Keep your custom stylesheet definition as clean as possible and include only the style classes needed to avoid style conflicts.

See Enterprise PeopleTools 8.50 PeopleBook: Application Designer Developers Guide,“Creating Style Sheet Definitions.”

Reviewing Branding Themes

A branding theme is a compilation of HTML, text, images, style classes and other objects that, when assigned to a portal, provides a distinct portal "look and feel." Changing a theme can be as simple as changing the logo displayed in the header HTML, or selecting a different style sheet to change the color scheme or text font. It can also be as complex as replacing delivered PeopleSoft objects to create new custom-built designs.

Themes contain a set of styled objects including:

• Homepage and target page headers.

• Homepage footer.

• Style sheet.

• Menu style.

Multiple predefined themes are delivered for headers, footers, HTML Layouts, menu styles and style sheets, so you can perform test configuration right out of the box.

As delivered, the theme that is active depends on your user role (for example the System Administrator role should default to the theme PAPPBR_THEME_PT_SWAN) and is considered the default theme for any active portal registries in the database. If desired, you can define multiple themes and then assign them to appear based on a hierarchy of user role precedence, portal name, or sites. Each theme and its components carry effective dating, which allows work-in-progress and the staging of future changes to coexist with actively deployed themes.

If none of the existing theme parts meet the branding needs of your organization, you can create and implement your own. PeopleSoft Enterprise Portal branding does not provide the interfaces for a non-programmer to accomplish this HTML design. Once a custom HTML design is written, you can bring the HTML code into the database for use with the PeopleSoft Enterprise Portal branding. The code must incorporate the system elements that are the foundation of PeopleSoft Enterprise Portal branding.

Reviewing System Elements

Branding system elements or elements are the distinct entities or components within a portal header or footer. Oracle delivers many hard-coded elements which serve as the foundation for HTML layouts.

System elements are set dynamically. They can either turn into an HTML element, such as an image or hyperlink, or into a portion of HTML, such as a table row or table. They are usually dynamic, for one of the following reasons:

• There are entities such as images or hyperlinks that are configured by the portal administrator to achieve a desired look and feel (administrator defined).

• There are non-static URLs or conditionally-used JavaScript processed by the portal (system defined).

Only those elements designated as configurable are variable and can be assigned user-defined values.

There are generic types of elements that an administrator may choose to utilize within a portal header or footer, including:

PeopleSoft Enterprise Portal branding utilizes a few other types of elements to group objects or treats them specially.

The appearance of menu item-related links configured in bars is conditional upon the user having permission to navigate to any given menu item or special elements. If the user doesn't have permission to access a menu item, it doesn't appear in the Menu pagelet and it will not appear in the header either.

For example in the header PAPPBR_HEADER5_TOOLSNOTAB, where My Links is configured in the header. However, a Guest user does not have permission for this feature, so it does not appear in the header for guest users.

See Also

Managing Branding System Elements

Reviewing HTML Layouts

An HTML layout is a predefined arrangement of standard elements. Rather than building the custom HTML objects from scratch, you can select an HTML layout from predefined choices. Within each layout choice, you can turn sections on or off, and customize them by assigning your own images and adding hyperlink URLs.

For instance, an HTML layout may have placeholders for two logo images on the top-left and top-middle of the header. There might also be placeholders for two rows of links — one for the standard links like Home and Signout, and another set of links for other intranet sites. If your specific header only has one logo image in the upper-left and one set of links for Home, Signout, and so forth, you could still base the header definition upon this HTML layout. The unneeded placeholders for the extra images or links would not be used.

Since PeopleSoft applications deliver several HTML layouts, Oracle recommends that you leverage one that is close to your desired layout or placements.

Reviewing Headers

A header displays static information across the top of a web page. A header typically includes a unique design identifying the site, logo, search bar and frequently used links.

Reviewing Footers

A footer displays static information across the bottom of a web page. A footer typically includes links to privacy statements, terms of use, copyright information, and site maps.

In PeopleSoft Enterprise Portal branding, footers are not displayed on transaction pages.

Reviewing Menu Styles Overrides

A menu style is a set of the style sheet, style classes and images applied to the PeopleSoft Enterprise Portal menu pagelet display.

Understanding Items You Can Brand

The PeopleSoft Enterprise Portal branding feature enables you to configure items such as headers, footers, and menus. You then assemble the items into themes, and then assign them according to portal registry, site, or user role.

Note. You may remove and replace Oracle or PeopleSoft logo images. Doing so will not violate your software license and service agreement and is authorized only for PeopleSoft Enterprise Portal licensees.

Reviewing Homepages

A homepage is the opening or main page of a Web site, intended chiefly to greet visitors and provide information about the site.

Homepages in the PeopleSoft Enterprise Portal are non-frame-based HTML.

Reviewing Transaction/Target Pages

A transaction page or target page is the destination of a navigational link. Most of the time, the transaction page or target page is an application or PeopleSoft Pure Internet Architecture page.

PeopleSoft Pure Internet Architecture pages are frame-based, meaning that the header, left navigation area and main body are contained in separate frames.

Target content page presentation is primarily based on the template registered with the content reference. If you use the PeopleSoft Enterprise Portal default template for a target content page, you will have the target content page header and the PeopleSoft Enterprise Menu pagelet with full branding support.

For other delivered templates, presentation will vary depending on what is included in the template. For example, if you choose a template that includes the standard PeopleTools menu, you will not be able to change the image used to expand the menu unless you override the existing image with the new image using the same image name.

Different iScript calls will result in different branding presentations. IScript_UniHeader() will render the homepage header specified in the branding theme without the Personalization bar. IScript_UniHeader_PIA() will render the target content page header specified in the branding theme.

PeopleTools PeopleBooks contain details about creating templates and incorporating these iScript calls into your template.

See Enterprise PeopleTools 8.50 PeopleBook: PeopleTools Portal Technology,“Designing Portal Templates.”

Reviewing Pagelet Templates

PeopleTools provides fixed-named HTML and image objects to build portal homepage tabs. You can override the default HTML objects and images used for homepage components per tab or per pagelet, using the Content Ref Administration page.

In addition to overriding the default HTML for each pagelet, you can also override the default HTML by column.

An example is provided later in this section that demonstrates these concepts.

See Example: Using Branding and Portal Registry Attributes to Create Custom Homepages.

See Also

Enterprise PeopleTools 8.50 PeopleBook: PeopleTools Portal Technology, “Using Pagelet Wizard”, Defining Pagelet Wizard Headers and Footers

Enterprise PeopleTools 8.50 PeopleBook: PeopleTools Portal Technology PeopleBook, “Administering Content References.”

Reviewing Headers, Footers and Menus

The following table lists branding items that you can configure.

Reviewing PeopleSoft Enterprise Portal Sites

When implementing portal sites using PeopleSoft Enterprise Portal Site Management, PeopleSoft enables you to retain the primary enterprise portal brand on the site, display a distinct site brand, or display a mix that includes some aspects of the enterprise portal brand in the site brand.

A site home is a default tab or entry page for a portal site created with the PeopleSoft Enterprise Site Management Create New Site wizard.

In situations where the site inherits the theme of the main enterprise portal, users receive access based on the roles defined for the enterprise portal. Note, however, that the site administrator may be able to override specific elements for the portal site.

See Site Management Overview.

Reviewing Collaborative Workspaces

Branding of collaborative workspaces is accomplished through the properties of the workspace template. Each workspace created from a template uses the branding theme assigned to the template. In addition, the workspace template owner can determine which if any branding elements are overridable by workspace administrators.

See Setting Up Collaborative Workspace Options and Templates.

See Configuring Advanced Options for a Workspace.

Understanding Branding Methods

Branding allows you to configure the following design aspects which wrap the actual portal content: the header, footer, and navigation menu. You can configure multiple looks and combine them into themes that you assign per portal site and optionally, per user role.

The remaining aspects of a homepage’s presentation of pagelets are configurable using the portal registry using the attribute name/value pairs. When you register pagelets and define homepage tabs, you can assign your own designs. Each portal site can assign different styles to the same pagelet. Each site can also have distinct designs for its homepage tabs.

See Enterprise PeopleTools 8.50 PeopleBook: PeopleTools Portal Technology, “Administering Portals.”

See Site Management Overview.

Lastly, the design of the target content page is controlled by the content’s source application. For PeopleSoft applications, the target content page layout is determined by the page definition created using Page Designer. The target content page layout is incorporated into the template specified in the portal registry when you register the page (component) as a content reference. Each type of target content page (a PeopleSoft application page, a third-party application page, a web site target page, and so forth) can be registered using a different template, if appropriate. Note that each portal site can register the same target content page using a different template, if required. These complete page templates for target content pages may include a header and menu navigation, or not. They can be frame templates or not. If no template is assigned to the content reference in the portal registry, a default portal template is applied.

See Enterprise PeopleTools 8.50 PeopleBook: PeopleTools Portal Technology, “Designing Portal Templates.”

For custom branding, you can create bind variables to embed dynamic content within your static content, or you can copy existing html objects and modify the table and divs to meet your custom needs.

Storing and Referencing Images, Stylesheets and JavaScript

When creating images, stylesheets, and JavaScript, you have two options:

• Create new images and stylesheets within Application Designer.

• Leverage a centralized repository of images, stylesheets, and JavaScript files.

This section provides examples of how to reference objects stored outside of the PeopleSoft system.

Note. In the examples shown, you can also use relative paths, if the referenced web server is the same as the PeopleSoft portal server or if an alias has been created.

Reviewing Branding Methods for Homepage Customizations

The following tables summarize the branding methods you should use to perform customizations on homepages.

Note. If both PeopleSoft Enterprise Portal branding and portal registry attribute configuration are checked, in general, you can use the portal registry attribute configuration to override the default HTML objects. If you do not need to override the overall layout and only need to adjust colors and styles, you can choose to include certain style classes in your branding style sheet. Including these style classes also gives you greater control of the color scheme based on portal registry or user role, depending on the branding setup.

The following table summarizes the branding methods you should use to perform PeopleSoft Enterprise Portal graphical user interface (GUI) customizations of the homepage:

The following table summarizes the branding methods you should use to perform PeopleSoft Enterprise Portal graphical user interface (GUI) customization of homepage pagelets:

The following table summarizes the branding methods you should use to perform PeopleSoft Enterprise Portal graphical user interface (GUI) customization of homepage menus:

Reviewing Branding Methods for Target Page Customizations

The following tables summarize the branding methods you should use to perform customizations on target pages.

Note. If both PeopleSoft Enterprise Portal branding and portal registry attribute configuration are checked, in general, you can use the portal registry attribute configuration to override the default HTML objects. If you do not need to override the overall layout and only need to adjust colors and styles, you can choose to include certain style classes in your branding style sheet. Including these style classes also gives you greater control of the color scheme based on portal registry or user role, depending on the branding setup.

The following table summarizes the branding methods you should use to perform PeopleSoft Enterprise Portal graphical user interface (GUI) customization of target page content:

The following table summarizes the branding methods you should use to perform PeopleSoft Enterprise Portal graphical user interface (GUI) customization of target page menu areas:

Understanding Items You Cannot Brand

The following items are not incorporated into PeopleSoft Enterprise Portal branding configuration pages. Therefore you cannot dynamically display them based upon the portal site or user roles, as with the items you can brand discussed in the previous section.

Some homepage items can be styled using attributes on the content reference entry in the portal registry. Depending on how you designate your changes, the changes can be applied at a portal site, homepage tab, or individual pagelet level.

See Enterprise PeopleTools 8.50 PeopleBook: PeopleTools Portal Technology, “Modifying the Portal Interface,” Using Predefined Homepage HTML Objects, Adapting Homepage and Pagelet Objects.

While you can modify pagelet icons and PeopleTools-level HTML objects, such as homepage layout, pagelet frame, pagelet border, and so on, these elements cannot be applied differently based on user role. One style must be applied throughout, without custom coding.

Reviewing PeopleTools Portal Objects

Within PeopleTools, the objects are set at the portal database level only. You cannot change the parameters or configuration at runtime from the portal application pages. The calls to these objects are currently made in PeopleTools C code to provide the best performance.

Do not make customized code changes to these objects to incorporate them into the branding model. Doing so could make upgrading difficult.

Note. You can override PeopleTools-level objects via content reference attributes. You cannot override PeopleSoft Enterprise Portal-level objects via content reference attributes. Changes to PeopleSoft Enterprise Portal objects should be treated as standard customizations to Application Designer objects, such as HTML objects, PeopleCode, and so on.

See Enterprise PeopleTools 8.50 PeopleBook: PeopleTools Portal Technology, “Modifying the Portal Interface,” Using Predefined Homepage HTML Objects, Adapting Homepage and Pagelet Objects.

Understanding Branding Across Remote Nodes

Remote nodes, such as remote sites, remote content providers, external URLs, and so forth, are applications outside of a PeopleSoft Enterprise Portal which provide content to the portal via links. Remote content is rendered or controlled from the outside application, not the local enterprise portal environment. Once a user navigates to remotely-provided content, portal branding may fall away in favor of the content provider’s look, if the remote site takes over the rendering of the entire browser window.

In HTML-based templates, like the homepage, PeopleSoft Enterprise Portal generates or aggregates the HTML for the entire page and sends it to the browser as one page. Thus, there is a greater amount of control over the HTML, and therefore the look and feel. In frame-based templates, typically seen with transaction pages, the portal typically controls the administrative frames, such as the header and left-hand navigation. However, the target frame or page is usually managed by the remote site. The frame acts independently of the others, so the portal does not filter or influence any of the look and feel of the remote site. If the portal renders the frames for the header and left-hand navigation, then the remote site is only influencing the target page frame. However, if the remote site "breaks" its frame, its HTML may be coded to take over the entire browser window. In this case, the portal header is lost and the branding of the remote site takes over.

Reviewing Branding Behavior With Remote Transactions

All branding applies primarily to content references registered in the PeopleSoft Enterprise Portal database. The portal brand may also "wrap" remote content, if that remote content appears within a frame that is separate (and typically under) a header frame that is rendered or controlled by the portal.

PeopleSoft requires that the PeopleSoft Enterprise Portal database be a separate database from application databases. For a PeopleSoft business application database that has only a single link registered in the PeopleSoft Enterprise Portal, the branding of the remote database will control the entire page, including the header. Since this other PeopleSoft application does not include PeopleSoft Enterprise Portal branding, the header and other branding elements will appear as the PeopleTools-delivered defaults.

If you need a consistent portal brand to appear, an approach of registering the content references of the remote application in the PeopleSoft Enterprise Portal registry may be appropriate. You can load the full navigation or information architecture of the PeopleSoft application into the enterprise portal. Refer to two documents posted on My Oracle Support for more details: "PeopleSoft Enterprise Portal 8.4x - Implementing Navigation and Portal Packs” and “Enterprise Portal 8.4x/8.1x: Managing Information Architecture."

With the local registration of remote pages or content you will retain the enterprise portal branding for the portal homepage header, footer, and pagelets. However, the contents of the transaction page will be controlled by the remote content provider, such as another PeopleSoft Pure Internet Architecture (PIA) application or another web site.

If you choose to set up a single link in the enterprise portal to another PeopleSoft application, then navigating to that link will result in a page or homepage where the remote application is rendering the entire browser page. Therefore, the header is not rendered with the enterprise portal branding. To retain the portal branding on the header, you can customize the portal templates in the remote application database so that the header is generated by PeopleSoft Enterprise Portal.

The header and footer are actually generated through iScript calls. If you are in a remote database and need to use the PeopleSoft Enterprise Portal header, change the iScript call from the local node to the PeopleSoft Enterprise Portal node—you need to use the PeopleSoft Enterprise Portal as your content provider for header and footer calls.

For instance, the PeopleSoft Enterprise Portal homepage (HTML.PORTAL_HP_USER_TEMPLATE) uses the following reference for the header:

<Pagelet Name="UniversalNavigation">
   <SOURCE Node="LOCAL_NODE" 
      href="s/WEBLIB_PORTAL.PORTAL_HOMEPAGE.FieldFormula.
      IScript_HPDefaultHdr"/> 
</Pagelet>

In the remote database, you need to change the node to reference the enterprise portal, not that local node, which in this case is the remote application. Thus, a remote application or database could theoretically get an enterprise portal header.

You should consider and pursue this type of customization only with staff that has ample knowledge and experience in this area.