Lab 1 - Portal UI Tour

8/4/2019 Lab 1 - Portal UI Tour

1/13

App l ica t ion In tegra t ion Wi th

WebSphere Port a l V 6.1

Lab Manual

Lab 1

Port a l UI Tour

1

COPYRIGHT IBM CORPORATION 2008. ALL RIGHTS RESERVED.


2/13

I n t roduc t ion :

In this lab, we will highlight some of the main features of WebSphere Portal 6.1. We will explore some ofthe out-of-the-box portlets and pages deployed within WebSphere Portal. We will learn how to create newusers and groups. And, we will demonstrate how users can work with portlets and pages.

Objec t ive :This lab will explain the following tasks:

Getting familiar with Portal basics

Constructing a Portal pages

Personalizing pages and portlets

Procedure:

PORTAL BASIC

In this first part of the lab, we will look at some of the out-of-the-box portlets and pages. In this process, we will learn someof the primary ways to navigate in the Portal environment. Finally, we will look briefly at functions available to portal ad-ministrator through the browser user interface.

Step 1 Double click on the icon Start Portal Server to start WebSphere Portal.

Step 2 Open a web browser to the Portal login page:

a. http://portal.ibm.com:10040/wps/portal

Step 3 Logon to the Portal (userid: wpadmin, password: passw0rd).

The next page to load will be the Login page. Once you logged in, you will be redirected to theHome page of WebSphere Portal. The Login page with Login portlet is set to display only for

2

http://portal.ibm.com:10040/wps/portalhttp://portal.ibm.com:10040/wps/portal


3/13

unauthenticated users, while other pages and portlets are set to display only for authenticated

users.

On the right-hand side of the Getting Started page you will see a list of areas (Web 2.0 Intro-duction, Feeds, Gadgets and so on). These tabs allow rapid navigation to the embedded

pages. These areas are simply collections of pages located in the Portal content root that to-gether provides some set of additional application function to the base Portal. Each of theseembedded pages has a similar layout and navigational pattern to make it easier for users to

familiarize themselves with Portal.

Step 4 Click on the Web 2.0 Introduction area. The Web 2.0 Introduction page will be loaded with aportlet. The portlets are the building block of Websphere Portal. They are small applications

that are independently developed, deployed, managed, and displayed. Administrators and us-ers compose personalized pages by choosing and arranging portlets, resulting in customizedWeb pages.

Step 5 Click on the Feeds area.

Step 6 On this page, you will see three portlets, Information, IBM Press Release and IBM Redbook

portlets. Click on the page context menu and select Edit Page Layout.

Step 7 The next page to load is the Page Customizer. Here, you can add, delete and arrange port-lets, columns and rows. You can also modify the appearance of the portlets. Modifications oc-cur as you make them. DONOT make any changes at this moment, click Done to exit.

Step 8 Again, click on the page context menu. Select Edit Page Properties.

3



4/13

Step 9 The next page to load is the Page Properties page. Here, you can change the page title, lookand feel, cache options, allowed portlets and so on. DO NOT make any changes, click Cancelto exit.

CONSTRUCTING APORTAL PAGE

You have seen how to customize a portal page usingPage CustomizerandPage Properties. Next, we will explore howthe customization and configuration can be done for portlets. We will be creating a page using Portal administrative port-lets. We will then add a portlet to the page and perform configuration and personalization on the portlet.

Step 1 On top of Portal page, click on Administration link.

Step 2 Portal Administration page will be loaded. You are seeing this page because you logging inas portal administrator (i.e. wpadmin). If you are logging in with non-administrator user, you willnot see this page. This restriction is managed by Portal Access Control (PAC). PAC definesroles the user has on Portal resources as well as what action the user can perform.

Step 3 From the left-hand navigator, under Portal User Interface, click on Manage Pages link.

Step 4 From the Manage Pages portlet, click on Content Root.

Step 5 Click Home.

4



5/13

Step 6 Click New Page button ( )

Step 7 On the Page Properties portlet, enter page title My Page and click OK.

Step 8 Go back to WebSphere Portal home by clicking on Home link.

Step 9 Verify that My Page is created.

Step 10 Click on My Page.

The page is currently empty. Therefore, we need to add portlets to the page. One of the easierways to add a portlet to a page is to use Portlet Palette.

The Portlet Palette allows you to add portlets to the page for quick and easy page customization. You can drag a portletto the page from the Portlet Palette to add the portlet to the page.

Step 11 On the right-hand side of portal page, right below the portal search bar, you will find a button to

open up the Portlet Palette ( ). Click on the Portlet Palette ( ) button.

5



6/13

Step 12 Portlet Palette will appear. Type RSS in the Portlet Palettes Search Bar and click the search

button ( ).

Step 13 RSS Portlet should appear in the search result.

Step 14 Click on the RSS Portlet and drag it to My Page. A horizontal bar appears as you drag theportlet over areas on the page available for deployment. When you drag the portlet within closeproximity of a permissible drop zone, the color of the horizontal bar changes from a muted to amore saturated tone.

Step 15 Drop the portlet to the page as appropriate by releasing the mouse key to add the portletwhere you view a horizontal bar. RSS portlet will be added to the page such as below:

6



7/13

Step 16 Click on the RSS Portlet context menu then select Configure.

7



8/13

8

Portlet modes allow a portlet to display a different user interface, depending on the task that is required of the portlet.

Personalize: Updates change the look of the portlet only for the user who makes the updates. In order for a user to haveaccess to personalize settings, they must be granted at least Privileged User role on the page and Privileged User role on

the corresponding Portlet Definition. This is available for standard portlets and IBM portlets.

Edit Shared Settings: Updates change the default look of the portlet on a specific page. All users see the change whenthey access that page. In other words, all (the particular) portlet instances on a page are modified, but not all instances ofthat portlet on every page. If you want the changes to appear on every page that portlet appears, you must modify thesettings on each page. In order for a user to have access to edit shared settings they must be granted at least Editor roleon the page and Editor role on the corresponding Portlet definition. This is available for standard portlets and IBM APIPortlets

Configure: Updates change the default look of a portlet for all portlet instances. All users see the portlet changes on allpages that portlet is available. A user needs to have at least Manager role on portlet definition to have access to configurea portlet.

Step 17 In the Configure mode, type http://rss.cnn.com/rss/cnn_topstories.rss in the URL filed.Keep the rest of fields as default.

Step 18 Click on the Add button ( ) to add a new RSS feed. Verify that URL is being added tothe URL list.

Step 19 Click Save to exit the portlet configuration mode. You should see CNN Top Stories in yourRSS Feed portlet.



9/13

9

As Portal administration, you can use portlet configuration mode to define settings not changeable by portal users. At thesame time, you may want to give user the flexibility to personalize the RSS portlet. For example, you may want to allowuser to be able to add their own RSS URL. You do this by giving user an Editor role on the portlet. When user clicks onthe portlet context menu, they will seePersonalizemode.

Step 20 Click on Log out link to log out as Portal administrator.

Step 21 On the Portal Login page, login as user David (User ID: david, Password: password). If theuser does not yet exists, enroll the user using Step 22 to Step 25. Otherwise go to Step 26.

Step 22 From the Portal Login page, click on Sign up link to create a new user.

Step 23 Specify the following values:

User ID : david

Password : password

Confirm Password : password

First Name : David

Last Name : -- anything you like ---

Email :

Preferred Language : English (United States) [en-US]

Step 24 Click OK to continue.

Step 25 A confirmation message indicating that user is successfully created. Click Log in button

( ) to continue.



10/13

Step 26 Notice that David is not a Portal administrator; therefore, David will not see the link to Portaladministration page. Click on My Page.

Step 27 David should see the CNN Top Stories feed added by Portal administrator in previous steps.Being a Portal user, David can add his own RSS URL by going to Personalize mode. Click on

the Portlets context menu then select Personalize.

Step 28 As you have noticed, the RSS URL added by Portal administrator is not removable. This is de-fined during portlet development time. As a portlet developer, you can choose whether to allow

user to make changes. Key in http://rss.cnn.com/rss/edition_sport.rss in the URL field and

click Add button ( ). This will add the CNN World Sports feed to the portlet.

Step 29 Click Save to exit.

Step 30 CNN.comSport feed should be displayed in the RSS portlet. The CNN World Sports feed isthe users (i.e. David) personalized setting. If you login as another user, you will not see theCNN World Sport feed added by David, therefore, creating a personalized experience for each

portal user.

Step 31 Click the Log out link to log out as David.

Step 32 From the Portal Login page, click on Sign up link to create a new user.

10



11/13

Step 33 Specify the following values:

User ID : jane

Password : password

Confirm Password : password

First Name : Jane

Last Name : Doe

Email : [email protected]

Preferred Language : English (United States) [en-US]

Step 34 Click OK to continue.

Step 35 A confirmation message indicating that user is successfully created. Click Log in button

( ) to continue.

Step 36 Login as Jane (User ID: jane, Password: password).

11



12/13

Step 37 Click on My Page. You will NOT see CNN World Sports feed added by David.

Step 38 You may be wondering why/how users are allowed to personalize these pages. This is allowedbecause they have the Privileged User role assigned to them. To verify this:

a. Login as Portal administrator (i.e. wpadmin)

b. Navigate to the Administration page; select AccessResourcePermissions to go tothe Resource Permission portlet.

c. Select PagesContent RootHome.

d. Click the Assign Access button ( ) for the page named My Page.

e. Click on Edit Role button ( ) for the Privileged User role.

12



13/13

f. Observe that All Authenticated Portal Users have the Privileged User role. This type ofrole is what allowed pages/portlets to be personalized. In addition, by default, this role is

propagated down to the pages located under the My Page page.

Step 39 Logout from the Portal.

Summary :

In this lab, you become familiar with the basic WebSphere Portal interface. You explored some of the specific functionsareas from administration pages. In addition, you learned how to personalize a page and a portlet.

13


Lab 1 - Portal UI Tour

Documents