You are now ready to begin adding portlets and items to the
page. As a page designer, you might do this yourself, or perhaps ask the content
contributors and content managers of your page to add content based
on the layout you have built for the page.
In OracleAS Portal, content takes one of two forms: a portlet
or an item. A portlet is a reusable building block for easily publishing
information and applications to your community. An item is a lower-level building
block used to display content, such as documents, URLs, text, and images, or
to provide navigation.
For this lesson, assume that you will finish the Home
page by yourself.
The steps and privileges required for creating
this lesson are listed in the table below.
Step
Privileges Required
Create a Page
Member of Page Designers group,
or Manage All privileges on the page group, or Create global privileges on all pages
Region 1 contains
the reusable navigation banner that you created earlier.
Region 2 shows items and portlets
vertically.
Region 3 contains tabs. The
tabs control what is shown in Region 4.
Region 4 contains tab-specific content.
Perform the following tasks:
1.
In the top right of the page,
click the Navigator link.
2.
In the Path
link, click <YourName> Oracle By Example.
3.
Click the Pages link.
4.
Click the Create New... Page
link at the top left of the page.
5.
In the Page Typelist, select Standard.
In the Namefield, enter <YourName>_OBE_page.
In the Display Namefield, enter <YourName>
OBE Home Page.
In the Navigation Page For Banner list, select <YourName>
OBE Banner. This is the page that you had earlier created in the
Creating a Navigation Page topic in the
Building
the Portal Site lesson.
Accept the default Cache Page Definition Only option button and
click Next.
Note: The contents of a OracleAs Portal page are the various
items and portlets that have been added to the page. Page caching enables
faster and more efficient means to assemble Web pages dynamically. The
Page Cachingoptions enable
you to store copies of the page’s definition and contents in memory.
The page definition includes information about the page such as its
layout and look and feel. You can use the Page Caching options to improve
the performance of your page, especially if you expect many users to
access it frequently.
6.
In the Page Templatelist, accept the default selection, None. Click Next.
A page template provides a way of enforcing a particular layout, style,
set of privileges, and content for multiple pages. Because you are building
only a single page, there is no need for a template. You define the
look and feel, privileges, and content on the page itself.
7.
In the Choose Stylesection,
choose <YourName>Page Style from the Style
list. Click Next.
The Page Style chosen specifies the fonts and colors to be used by
all regions on the page. However, item regions on a page can be configured
to override the page style.
8.
In the Grant Access
section, enter AUTHENTICATED_USERS
in the Grantee field and select View from the
list containing various privileges.
Click the Add button. This provides all users, who can log in
to OracleAS Portal, the privilege to view your portal pages.
Click Finish.
9.
You now define the page layout.
On the empty region at the bottom of the page, click the Add Region
Right icon.
Use regions to divide the page into different sections. Each region
has settings to determine what type of content it contains and settings
to render the content.
10.
You have two empty regions at
the bottom of the page. Click the Add Region Right icon again.
11.
Now, you
should have three empty regions at the bottom of the page.
Click the Edit icon in the bottom-left region.
12.
Set the Region Type to Items.
Click Apply.
After you specify what type of content a region should
contain, you can set the properties to define how the content in that
region should be rendered.
13.
In the Region Display
Options section, set the Width to 19%.
Click OK.
14.
Click the Edit icon at the bottom region.
15.
Set the Region Type to Items.
Click Apply.
16.
In the Region Display
Options section, set the Width to 1%.
Click OK.
17.
In the bottom-right region,
click the Edit icon.
18.
Set the Region Type to Items.
Click Apply.
19.
In the Region Display
Options section, set the Widthto 80%.
In the Item Display Options section, set Space
Between Items and Space Around Items to 0
(zero) pixels.
Click OK.
20.
In the bottom-right region,
click the Add Tab icon to create a tab.
Tabs enable you to organize your page content so that it is not all displayed
at once. Content placed in a tabbed region is shown only when the tab
is active. To add content to a particular tab, ensure that tab is active
when you add the content to the region specified by the tab.
21.
Click Add Tab to the right of the tab you just
created four times to create four additional tabs.
OracleAS Portal provides a default look for tabs. Styles provide
the ability to change the tab color, font, and font color. If desired, you may
upload custom images for tabs. You can specify both the active and inactive
images for a tab. In this lesson, you will use custom images for your tabs,
utilizing a rollover effect with both active and inactive tab images.
1.
Click the Edit icon to configure the first tab.
2.
In the Display
Name field, enter Home.
3.
Browse for <portal_unzip>\portalOBE\images\a_home.gif
for the Active Tab Image.
4.
Browse for <portal_unzip>\portalOBE\images\i_home.gif
for the Inactive Tab Image.
5.
Click Apply
to see the images refreshed on the page. Click OK.
Note: You do not see the tab image in edit mode for the page.
In order to see the images displayed in context, click the View Page link
at the top right. Click the Edit link on the banner to
get back to edit mode.
6.
Click the Edit icon to configure the second tab.
7.
In the Display
Name field, enter HR.
8.
Browse for <portal_unzip>\portalOBE\images\a_hr.gif
for the Active Tab Image.
9.
Browse for <portal_unzip>\portalOBE\i_hr.gif
for the Inactive Tab Image.
10.
Click OK.
11.
Click the Edit icon to configure the third tab.
12.
In the Display
Name field, enter Key
Indices.
13.
Browse for <portal_unzip>\portalOBE\images\a_keyIndices.gif
for the Active Tab Image.
14.
Browse for <portal_unzip>\portalOBE\images\i_keyIndices.gif
for the Inactive Tab Image.
15.
Click OK.
16.
Click the Edit icon to configure the fourth tab.
17.
In the Display
Name field, enter Personal.
18.
Browse for <portal_unzip>\portalOBE\images\a_persContent.gif
for the Active Tab Image.
19.
Browse for <portal_unzip>\portalOBE\images\i_persContent.gif
for the Inactive Tab Image.
20.
Click OK.
21.
Click the Edit icon to configure the fifth tab.
22.
In the Display
Name field, enter Email.
23.
Browse for <portal_unzip>\portalOBE\images\a_myEmail.gif
for the Active Tab Image.
24.
Browse for <portal_unzip>\portalOBE\images\i_myEmail.gif
for the Inactive Tab Image.
Users with an appropriate privilege level can add content
to a page by adding items, such as text, hyperlinks, images, and so on to an
item region. In addition to the built-in item types available with OracleAS
Portal, you can create and configure your own item types within your portal,
if needed. Item content and metadata are stored in the Portlet Repository. Items
are rendered on the page according to the layout, style, and attribute display
properties defined for the item region.
OracleAS Portal provides a few built-in item types. One of
these built-in item types is Portal Smart Text. The Portal Smart Text items
are self-configuring. For example, if you add a Portal Smart Text item (such
as current date, current user, or current page) to a navigation page, the information
is published automatically without any coding efforts.
To add the current date, perform the following steps:
1.
Click the Add
Item icon in the bottom-left region.
2.
Select Portal Smart
Text from the Built-In Navigation Item Types list.
3.
Click Next.
4.
For Text Type,
choose Current Date.
5.
Click Finish.
Add
an Image to Visually Separate the Page Content
You can add an image of a vertical line to visually separate
the navigation area on the left side of the page from the content area on the
right side of the page.
1.
Click the Add
Item icon in the middle region.
2.
Select the Simple
Image content item type.
3.
Click Next.
4.
Browse for the image
<portal_unzip>\portalOBE\images\vertLine.gif.
Text Items enable you to enter any text that you want to display
on a page. You can use the Rich Text Editor
to specify the text color or font and HTML tags to further enrich the text displayed.
Note: The Rich Text Editor
is available only if you are using the Microsoft Internet Explorer browser.
The Rich Text Editor can be enabled or disabled in the Page
Group properties (Item tab).
1.
Ensure that the Home
tab is the active tab.
Note: OracleAS Portal makes it very
easy to place content on different tabs as new items or portlets are
always added to the active tab.
2.
In the region directly
under the tabs, click the Add Item icon.
3.
Select the Text
content item type.
4.
Click Next
5.
In the Item
Attribute Text section, click the View HTML source check
box.
You can enter the text directly in this text area,
or switch to HTML source view where you can have full control over writing
any valid HTML. Toggling the View HTML source check box enables
you to move between the two views.
6.
Paste the following code snippet of an HTML table into the text area.
This code can also be copied from the <poratl_unzip>\portalOBE\welcomeHTML.txt
file. It may be difficult to see when the text box is empty, but ensure
the View HTML source check box is selected before you
paste the HTML code sinppet into the text area.
<table
border="0" cellpadding="0" cellspacing="0"
style="border-collapse: collapse" bordercolor="#111111"
width="90%">
<tr>
<td width="947" colspan="3"> <font class="inplacedisplayid62787siteid0"><b>
<font face="Arial" color="#663300" size="2">Welcome
to Oracle By Example's
Business to Employee (B2EE) Portal</font></b></font></td>
</tr>
<tr>
<td width="230"> <img border="0" src="http://portalstudio.oracle.com/pls/ops/docs/FOLDER/OBE/WELCOMEIMAGE.GIF"
width="230" height="100"></td>
<td width="18"> </td>
<td width="699"><strong><font face="Arial"
size="2" color="#CD6C51">Oracle
By Example</font></strong><font color="#330000"
size="2" face="Arial" class="inplacedisplayid43197siteid0"><strong><font
color="#cd6c51">
B2E Portal</font></strong> <font color="#663300">is
a <strong>single</strong>/global
individualized portal where you can find and use the end-to-end business
solutions needed to support your business responsibilities. The portal
eventually
include access to a full complement of common services and tools that
help
you manage your work, life and career.</font></font></td>
</tr>
</table>
7.
Deselect the View
HTML Source check box. You should see a preview of the HTML code.
So far, all the regions created on the page have been item
regions. Portlet regions must be created in order to hold portlets. A portlet
is a reusable, pluggable Web component that typically displays portions of Web
content. The region within which a portlet is contained determines whether the
portlet should show information, such as its header and border.
1.
Create a region under
the current date item by clicking the Add Region Below icon.
2.
Currently, this region
is not defined and it has the ability to hold items, portlets, or tabs.
Click the Add Portlet icon to add a portlet to
this region. The region is then automatically set to be a portlet region.
3.
In the Search
field, enter search
and click the Go button.
This searches the Portlet Repository for available
portlets. The Portlet Repository is a schema within an Oracle database
in which content and metadata associated with an instance of OracleAS
Portal are stored and managed.
4.
In the Portlet
Repository Search Results section, click the Basic Search
link from the Content page.
The portlet is moved to the Selected Portlets section.
All the portlets shown in the Selected Portlets section
are available on your region.
5.
In the Search
field, enter favorites
and click the Go button.
Notice how you can place as many portlets as desired
in the region while in this screen.
6.
In the Portlet
Repository Search Results section, click the Favorites
link from the Content page.
The portlet is moved to the Selected Portlets section.
7.
In the Search
field, enter external
and click the Go button.
8.
In the Portlet
Repository Search Results section, click the External Applications
link from the SSO/OID page. The portlet is moved to the Selected
Portlets section.
9.
Click OK.
Moving the Basic Search Portlet
First, you will create a region and move the Basic
Search portlet to this region. You will then set the region properties
so that portlets in this region do not display the portlet header or portlet
border.
1.
Click the Add
Region Above icon to add a region above the existing portlet region.
2.
Click the Edit icon to define the newly created
region.
3.
Select the Portlet
option for the region type and click Apply.
4.
Specify the settings for the Portlet Display Options
section as shown below, and then click OK.
Set Space Between Portlets to 0 pixels.
Set Space Around Portlets to 0 pixels.
Deselect the Show Portlet Headers check box.
Deselect the Show Portlet Borders check box.
5.
In order to move portlets
from region to region, you must switch from the current Graphical
mode to Layout mode. Click the Layout editing view
link at the top of the page.
OracleAS Portal provides three different views for building pages.
Graphical editing view renders
page content in-place on the page.
Layout editing view
shows a simplified page focusing on the structure or layout
of the page that enables page designers and content managers to move
content between regions and provides bulk mechanisms for deleting,
moving, hiding, and sharing content on a page.
Editing view displays a list of
content of all pages. This view also provides bulk actions such as
delete, move, and copy on content.
6.
Select the check box next to Basic Search and click
the Move button at the top of the page.
Note: The Basic Search portlet is
in the bottom-left region on the page.
7.
Select the
middle left region and click the Move Portlet
button. This is the newly created region.
Note: The item regions do not have
an option button. This is because you are moving a portlet. If you had
selected an item to move, then item regions would be available for selection.
8.
In order to return
to the Graphical editing view, click the Graphical
link at the top of the page.
9.
The portlet has been
moved to the new region, and is displayed according to the region settings.
Associating an Image to the Search Portlet
You will now use an image to make a suitable header for the
Basic Search portlet. You can combine item and portlet regions to look like
one visual area on the page.
1.
Click the Add
Item icon in the top-left region
that currently holds the current date item.
2.
Select the Simple
Image content item type.
3.
Click Next.
4.
Browse for the <portal_unzip>\portalOBE\images\Search.gif
image and click Finish.
Adding Content from External Web
Sites Using the Web Clipping Portlet
The Web Clipping portlet can be used to consolidate content
from various external Web sites into a centralized portal environment. It offers
an easy, intuitive way to capture content from existing Web sites and render
that content as portlets. The simplest forms of Web clippings can be sections
of HTML code in a Web page, including non-HTML components, such as applets or
JavaScript code. To create a Web Clipping portlet, use a Web browser to navigate
to the Web page containing the desired content. Next, select the portion of
the page to clip. Page parameters can be used to map any input data, which the
clipped area might require.
1.
The clipped content should show directly below the welcome
text item. You currently do not have a portlet region, so you must create
one.
In the bottom-right region that contains the welcome
text item, click the Add Region Below icon.
2.
Click the
Add Portlet icon in the newly created
region.
3.
Enter clipping
in the Search field and click the Go button.
4.
In the Portlet
Repository Search Results section, click the Web Clipping
Portlet link.
5.
The portlet is moved
to the Selected Portlets section. Click OK.
6.
Click the Edit icon for the Web Clipping portlet.
You must select the HTML page, or part of an HTML page, that you want
to appear within this portlet.
7.
Specify the following
address to clip content from http://portalcenter.oracle.com
and click the Start button.
8.
In the upper right corner
of the Web Clipping Studio page, click the Section icon link. Notice
how the zoom-in and zoom-out controls enable you to change the selection
areas.
Note: If the Portal Center site has
changed drastically, choose any section of the Portal Center page to clip.
9.
Scroll down and click
the Choose icon above the What Do You Want To Do?
section. The page is narrowed to the portion of the screen that you have
chosen.
Note: The clipped content is synchronized
with the source Web page content. Therefore, any changes to the source
Web page, including the display sequence, style, and font used for the
content is reflected in the Web Clipping portlet.
10.
Click the Select
link in the upper right corner of the screen.
11.
Select None from
the URL Rewriting list. This option does not rewrite the
URL link. Therefore, any action performed within the portlet will take you
out of OracleAS Portal into the clipped content Web site, Portal Center.
12.
In the Title
field, enter Portal Center.
13.
Click OK.
14.
Edit the region properties
by clicking the Edit icon in the region that contains
the Web Clipping portlet.
15.
Deselect both the Show
Portlet Headers and the Show Portlet Borders check
boxes to turn off the portlet header and border.
16.
Click OK.
17.
Click
the View Page link in the upper right corner to preview the page.
Click the browser's Back button,
or the Edit smart link to return to the Edit mode on
the page.
OracleAS Portal supports the use of a Web-based Distributed
Authoring and Versioning protocol (WebDAV). WebDAV access is intended to make
it easy for content contributors and content managers
to upload content to the portal directly from their desktops. Using
a WebDAV client, such as Windows Explorer, you can map OracleAS Portal page
groups to your desktop as Web Folders and seamlessly drag and drop content,
files, and folders back and forth between your portal and desktop. In addition,
using Web Folders, you can perform in-place opening, editing, and saving of
file-type items by using desktop applications that support WebDAV, such as Microsoft
Office 2000.
Note: When Oracle Application
Server is installed, the required oraDAV parameters are set with values that
enable access to Oracle database content through a Web browser or a WebDAV client.
By default, the OracleAS Portal DAV URL is: http://<hostname>:<port>/dav_portal/portal
Mapping the Local Network Drive to a WebDAV Client
1.
From Microsoft Windows,
open the Windows Explorer window.
2.
From the Tools menu,
select the Map Network Drive menu item.
3.
Click the Create
a Shortcut to a Web Folder or FTP site
link.
4.
Ask your portal administrator for the location of the Network Place.
Enter the URL to access your OracleAS Portal. The default URL that OracleAS
Portal uses is:
http://<hostname>:<port>/dav_portal/<dadname>
5.
Click Next.
6.
Enter your OracleAS
Portal login name and password and click OK.
Note: You can use
the same login name and password, which you used to log into OracleAS
Portal at the beginning of this OBE.
7.
Enter OBE
WebDAV for the name of this Network Place.
You can see this name in your Windows Explorer window.
8.
Click Finish.
The Windows Explorer window should open showing the contents of your portal.
The <YourName> OBE page group should be one of
the directories listed.
Creating a Portal Page Using Web Folders
You will now create a Portal page by using a WebDAV client
(Web Folders) and copy files from your local machine to the new Portal page.
1.
In the Windows Explorer
window, right click the <YourName>OBE directoryto open it. You should see the contents of <YourName>
OBE Page Group.
2.
Create a new folder
by right-clicking and selecting New > Folder.
3.
Rename the new folder
as OBEWebDAV.
Creating a directory in the WebDAV client has created
a new page in the OracleAS Portal environment.
4.
Right-click the OBEWebDAV
folder to open it.
5.
Copy the contents of
the <portal_unzip>\portalOBE\HR directory.
6.
Paste the files into the OBEWebDAV
directory.
7.
Return to the browser
keeping OracleAS Portal open. Click the Navigator link
in the upper right corner of the page. Your path should be Path: Page Groups
> <YourName> Oracle By Example > Pages.
Notice that a new standard page is
created in your portal, when you created a new folder in the Windows
Explorer window.
8.
Click the Edit
link for the OBEWebDAV page.
Note: All the files
that were copied using the Windows Explorer window show as a link on
the page. Clicking any of the links will open that file and you can
use these items in your portal.
9.
Click Page:
Access link at the top of the page.
10.
Select the Display
Page to Public Users check box to make these files available
to any OracleAS Portal user.
11.
Click OK.
Searching for Content Using
a Custom Search Portlet
You have seen how content contributors
and content managers can integrate files from their desktop to the OracleAS
Portal using a WebDAV client. Now, you will perform the steps to automatically
publish that content by using the search capabilities of OracleAS Portal.
Navigating to <YourName> OBE Home Page
1.
Click the Navigator
link at the upper right corner.
2.
Ensure that your path
points to Path: Page Groups > <YourName> Oracle By Example >
Pages.
3.
Click the Edit
link to the right of <YourName> OBE Home Page.
Adding a Custom Search Portlet
1.
Click the Add
Portlet icon on the region that contains
the Favorites and External Applications portlets.
2.
In the Search
field, enter Search
and click Go.
3.
In the Portlet
Repository Search Results section, click the Custom Search
link to move this portlet to the Selected Portlets section.
4.
Click OK.
5.
You must now configure the Custom Search portlet on your page to search
for the appropriate content.
Click the Edit
icon for the Custom Search portlet.
6.
Select the Automatically
display search results option button. This shows the results of
the search on your page, instead of the search form.
7.
Enter WebDAV
Files in the Portlet Header Title field.
8.
Click the What
to Search tab.
9.
Specify that you want
to search for Items.
10.
Restrict the search
to the <YourName> Oracle By Example page group.
Select the Search in selected page groups option
button.
Ensure that <YourName> Oracle By Example is
the only page group in the Page Groups to Search
field on the right.
11.
Click the Search
Criteria tab.
12.
In the Search
For field, enter portal.
13.
In the Find
Results that list, select the partially match all of
the terms (%term%) option.
You can choose any attributes associated with your content to search
within your portal. You use the Filter By options to
define search submission attributes for the search query.
14.
Click the Results
Display tab.
15.
Deselect the Save
Search link with link text check box.
16.
In the Style
list, select <YourName> Page Style.
17.
Ensure that the Display
NameandImage Link field is
the only field selected in the Displayed Attributes section.
18.
Click OK.
Because you are performing an automatic search, the search results are displayed
directly in this portlet.
19.
Click
the View Page link in the upper right corner to preview the page.
20.
Click the
browser's Back button, or the Edit
smart link to return to the Edit mode on the page.
In this lesson, you built a Portal page and structured your
page to display content. You created and organized your Portal page with tabs
and specified a layout for it. Then, you added images, text, and portlets to
your portal. In addition, you integrated content from another Website using
the Web Clipping portlet. You also accessed OracleAS Portal from a WebDAV client
and published items directly from your desktop to your portal. Finally, you
customized the search form and the results page according to your needs. In
the next lesson, you will create data-driven portlets, such as reports and charts.
You will also integrate these portlets into your portal, displaying dynamic
database content.