Build Your First Portal

Want to see how easy it is to create a portal with BEA WebLogic Portal? You can use this tutorial to build your first basic portal quickly and easily.

This tutorial is just one example of what you can do with the WebLogic Portal. BEA WebLogic Portal's robust features enable you to easily create and administer portals, portlets, and portlet pages. Your business needs and existing enterprise systems will determine the WebLogic Portal features and processes that you use to build your enterprise portal.

When you finish this tutorial, you can learn more about other approaches for developing and administering portals with BEA WebLogic Portal in the Development Guide at http://download.oracle.com/docs/cd/E13218_01/wlp/docs70/dev/index.htm and the WebLogic Portal Administration Guide at http://download.oracle.com/docs/cd/E13218_01/wlp/docs70/admin/index.htm.

This tutorial walks you through the following tasks to help you create a basic portal application:

• Step 1: Start the Server

• Step 2: Create A New Portal Site

• Step 3: Create a Portlet and Make it Visible to the Portal

• Step 4: Update the Look and Feel of the Portal

 

---

Before You Begin: A Note About the Sample Portal

This tour covers some basic portal-building steps using the Sample Portal provided by BEA WebLogic Portal. All steps in this tour assume that you are using the "Typical" installation of the WebLogic Portal on your local computer, which automatically installs the sample, and that your application is running on a Windows operating system.

If you are accessing the application on a remote server, using an atypical installation of the product, or are running the application on a different operating system, some of the paths and instructions provided in this tour may be slightly different. See your administrator if this is the case.

 

---

Step 1: Start the Server

Before you begin the steps in the tour you must start the Sample Portal server:

Select Start > Programs > BEA WebLogic Platform 7.0 > WebLogic Portal 7.0 > Portal Examples > Portal Example > Launch Portal Server.

 

 

---

Step 2: Create A New Portal Site

The following section walks you through the steps of creating a simple portal. Once you have created this portal, you can add portlets, pages, and "look and feel" attributes in subsequent steps.

For the purposes of this demonstration, the portal is created in an existing sample domain. For detailed information about creating and setting up new domains, see the Development Guide at http://download.oracle.com/docs/cd/E13218_01/wlp/docs70/dev/index.htm.

This tasks contains the following steps:

Step 2A: Create and Deploy the Portal

Step 2B: View New Changes in the Portal Administration Tools and Browser

Step 2A: Create and Deploy the Portal

To create and deploy a new portal, do the following:

1. Make sure the server is running (see Step 1: Start the Server) and launch the E-Business Control Center by selecting Start > Programs > BEA WebLogic Platform 7.0 > WebLogic Portal 7.0 > E-Business Control Center.

2. Once the server is running, choose File \> Open Project in the E-Business Control Center toolbar (Figure  1-1).

   Figure 1-1 Opening the Project File dialog box

   
    

3. In the Look In drop-down menu of the Project File dialog box (Figure  1-2), navigate to:

   <BEA_HOME>\weblogic700\samples\portal\sampleportalDomain\
   beaApps\sampleportal-project\sampleportal-project.

   Figure 1-2 Opening a Project File

   
    

4. Once you have opened the sampleportal project, click the Presentation tab at the bottom of the E-Business Control Center Explorer window, as shown in Figure  1-3.

   Figure 1-3 Explorer Window with Presentation Tab selected

   
    

5. Click the New icon in the Explorer tool bar and select Portal, as shown in Figure  1-4. The Portal Wizard screen appears.

   Figure 1-4 Opening the New Portal dialog

   
    

6. Be sure the Use the Portal Wizard option is selected, as shown in Figure  1-5, and click OK. Portal Name, the first page of the Portal Wizard, appears.

   Figure 1-5 Portal Wizard Screen

   
    

7. Name the new portal, "ThisNewPortal", as shown in Figure  1-6.

   Figure 1-6 Portal Name page of the Portal Wizard

   
    

8. Click the New button to create a new portal Web application. The Name New Portal Web Application page appears, as shown in Figure  1-7.

   Figure 1-7 Name the New Portal Web Application

   
    

9. Enter NewPortalWebApp as the name of the new Web application, then click OK to save the new name and close the window.

10. Click Next. The Portal Templates window appears, as shown in Figure  1-8.

    Figure 1-8 Portal Templates page of the Portal Wizard

    
     

11. Select the baseportal template and click Next. The Resource Files Location page appears, as shown in Figure  1-9.

    Figure 1-9 Resource Files Location page of the Portal Wizard

    
     

12. Verify that the location for J2EE resources for the new Portal Web Application are as shown:

    <BEA_HOME>\weblogic700\samples\portal\sampleportalDomain\beaApps\sampleportal.

13. Click Create.

14. The Portal Wizard will create files and list them in the Summary window, as shown in Figure  1-10.

    Figure 1-10 Summary page of the Portal Wizard

    
     

15. In the Summary page, click Next. The Next Steps page appears, as shown in Figure  1-11.

    Figure 1-11 Next Steps page of the Portal Wizard

    
     

16. To deploy the new portal, select the Yes, Hot Deploy Now option and click Deploy. You are prompted to log onto the server, as shown in Figure  1-12.

    Figure 1-12 Logon prompt

    
     

17. Enter the administrator username and password, the default is system/weblogic.

18. The deployment process runs for a few moments, displaying the window in Figure  1-13.

    Figure 1-13 Hot Deployment status window

    
     

19. Click Details if you want to see specific messages about the processes occurring.

20. When the new portal has been deployed successfully, as shown in Figure  1-14, click Close. Leave the E-Business Control Center open.

    Figure 1-14 Hot Deployment success

    
     

Step 2B: View New Changes in the Portal Administration
Tools and Browser

To confirm that the new portal is visible from within the WebLogic Portal Administration Tools:

1. Open the WebLogic Portal Administration Tools by navigating to the following URL:

   http://localhost:7501/sampleportalTools

   The login prompt appears (Figure  1-15)

   Figure 1-15 Logging Into the Administration Tools

   
    

2. Log into the Administration tools, the default username and password is administrator/password.

3. The WebLogic Portal Administration Tools Home page appears (Figure  1-16).

   Figure 1-16 Clicking the Portal Management Icon

   
    

4. Click the icon in the Portal Management heading. The Portal Management page appears, displaying the name of your portal Web application (Figure  1-17).

   Figure 1-17 New portal as viewed in the Portal Administration tools

   
    

5. The new (empty) portal should be visible through your browser, though no content has been placed inside this portal.

6. You can view the portal as a visitor (Figure  1-18) by entering the following URL in your browser:

   http://localhost:7501/NewPortalWebApp

   Figure 1-18 The new portal viewed through a browser

   
    

 

---

Step 3: Create a Portlet and Make it Visible to the Portal

Portlets are applications or collections of data that are shown within a larger portal. For example, a human resources portal at a large corporation might provide a portlet that allows an employee to log in and view their paycheck information and another portlet that allows them to update insurance information.

This task involves the following steps:

Step 3A: Create a Portlet

Step 3B: Make the New Portlet Visible

Step 3C: View the Results in a Web Browser

Step 3A: Create a Portlet

Now that the portal is deployed and running, use the Portlet Wizard to add a new portlet to the portal.

1. In the E-Business Control Center, click the Presentation tab.

Note: If you closed the E-Business Control Center, you need to restart it and open the sampleportal project file. See steps 1 through 4 of Step 2A: Create and Deploy the Portal for the procedure.

2. Click the New icon in the Explorer and select Portlet, as shown in Figure  1-19. The New Portlet Wizard window appears:

   Figure 1-19 Opening the New Portlet dialog

   
    

3. Select Use the Portlet Wizard, as shown in Figure  1-20, and click OK. The first page of the Portlet Wizard, the Portlet Name page, appears.

   Figure 1-20 New Portlet wizard window

   
    

4. Name the new portlet BasicPortlet, as shown in Figure  1-21.

   Figure 1-21 The Portlet Name page of the Portlet Wizard

   
    

5. Click Next, the Portal Pages page appears.

6. Check the home portal page to associate the new portlet with that page, as shown in Figure  1-22. This makes the portlet available for administration within that page.

   Figure 1-22 The Portal Pages page of the Portlet Wizard

   
    

7. Click Next, the Portlet Components page in Figure  1-23 shows components you can add to the portlet, such as a header.

   
    

   Figure 1-23 Portlet Components page of the Portlet Wizard

   
    

8. Do not select any additional components, and click Next. The Content Types page appears.

9. Select Basic (no Webflow) as your portlet content type, as shown in Figure  1-24, then click Next.

   Figure 1-24 Content Types Page of the Portlet Wizard

   
    

10. In the Resource Files Location window (Figure  1-25), verify that the path is the following:

    <BEA_HOME>\weblogic700\samples\portal\sampleportalDomain\beaApps\sampleportal\NewPortalWebApp\portlets.

    Figure 1-25 Resource Files Location page

    
     

11. Click Next. The Summary window, Figure  1-26, shows the files that the Portlet Wizard will create.

    Figure 1-26 Summary page of the Portlet Wizard

    
     

12. Click Create. The Wizard runs for a few moments while it creates the files, then the Next Steps page appears (Figure  1-27).

    Figure 1-27 Next Steps page of the Portal Wizard

    
     

13. Make sure both options are deselected and click Close.

14. Synchronize the portal project. Click the Synchronize button on the E-Business Control Center toolbar, shown in Figure  1-28. The Synchronizing Application window appears.

    Figure 1-28 The Synchronize button in the E-Business Control Center

    
     

    
     

15. The E-Business Control Center synchronizes the data you created in the Portlet Wizard. When the message "Synchronization Finished" appears (Figure  1-29), click Close. The Reset Campaign States window appears.

    Figure 1-29 Synchronization Is Complete

    
     

16. In the Reset Campaign States window, click Cancel.

To allow a visitor to see this portlet from the browser, it must be designated as visible and available using the WebLogic Portal Administration Tools. You will perform this task in the next step.

Step 3B: Make the New Portlet Visible

The new portlet is now on the server, but must be made available using the WebLogic Portal Administration Tools.

1. In your Web browser, navigate to the following URL:

   http://localhost:7501/sampleportalTools.

   The Logon prompt appears, as shown in Figure  1-30.

   Figure 1-30 Logon Prompt

   
    

2. Log in, the default username and password is administrator/password. The WebLogic Portal Administration Tools Home page appears.

3. Click the icon on the Portal Management bar, as shown in Figure  1-31. The Portal Management Home page appears.

   Figure 1-31 WebLogic Portal Administration Tools Home page

   
    

4. In the Portal Management Home page, click Default Portal, as shown in Figure  1-32. The Group Portal Management home page appears.

   Figure 1-32 Portal Management Home page

   
    

   
    

5. In the Group Portal Management Home page, click Manage Pages and Portlets (Figure  1-33). The Pages and Portlets page appears.

   Figure 1-33 Group Portal Management home

   
    

6. In the Pages and Portlets page, locate the page "Home" under Available Pages and click Edit Portlets (Figure  1-34). The Edit Portlet Entitlements and Attributes page appears.

   Figure 1-34 Pages and Portlets page

   
    

7. In the Edit Portlet Entitlements and Attributes page, select the portlet "BasicPortlet" and click the Set Attributes button (Figure  1-35). The Set Portlet Attributes page appears.

   Figure 1-35 Edit Portlet Entitlements and Attributes page

   
    

8. Set the Portlet's attributes to Visible and Available, as shown in Figure  1-36.

   Figure 1-36 Set Portlet Attributes

   
    

9. Click Save.

Step 3C: View the Results in a Web Browser

To view the new portlet in a Web browser, do the following:

1. Open a browser and navigate to:

   http://localhost:7501/NewPortalWebApp/index.jsp.

   The result should resemble that shown in Figure  1-37.

   Figure 1-37 Viewing the New Portlet

   
    

 

---

Step 4: Update the Look and Feel of the Portal

In this section of the tutorial, you will add some "look and feel" characteristics to your new portal, such as new skins and layouts (existing resources that affect the appearance of portals and portlets). This task consists of the following steps:

Step 4A: Make Skins and Layouts Available for Use in a Portal

Step 4B: Create the New Page

Step 4C: Synchronize the Modified Portal

Step 4D: Add New Skins, Layouts, and Portlets

Step 4E: View the Modified Portal

Step 4A: Make Skins and Layouts Available for Use in a Portal

In this step you will make existing skins and layouts available for use in your portal.

1. In the Explorer window of the E-Business Control Center, click the Presentation tab.

Note: If you closed the E-Business Control Center, you need to restart it and open the sampleportal project file. See steps 1 through 4 of Step 2A: Create and Deploy the Portal for the procedure.

2. Click the Portals icon, and select the Portal you created. In this example, select: "NewPortalWebApp: ThisNewPortal". (See Figure  1-38.)

   Figure 1-38 Your New Portal

   
    

3. Double-click the selected portal. The Editor for ThisNewPortal appears.

4. Click the General bar then click the Skins tab, as shown in Figure  1-39.

   Figure 1-39 Editor for ThisNewPortal

   
    

5. In the Available skins list, select the coologic skin, and click Add to move it into the Selected skins list.

6. Click the Portlets tab, the Portlets page appears within the Editor (Figure  1-40).

   Figure 1-40 Select Portlets tab

   
    

7. Select the parent folder for all of the portlets, and click Add to add all of the available portlets to the Selected portlets list as shown in Figure  1-40.

8. Click the Layouts tab, select the fourcolumn layout, and click Add to move it into the Selected layouts list.

9. Click the General bar to close the General Editor pane.

10. Click the Save icon to save your changes, as shown in Figure  1-41.

    Figure 1-41 Save Icon

    
     

Note: Keep the ThisNewPortal editor open.

Step 4B: Create the New Page

This step assumes you have kept your E-Business Control Center application open after completing the procedures in Step 4: Update the Look and Feel of the Portal.

Note: If you closed the E-Business Control Center, you need to restart it and open the sampleportal project file. See steps 1 through 4 of Step 2A: Create and Deploy the Portal for the procedure.

To create a new page in the portal, do the following:

1. Click the Pages bar as shown in Figure  1-42. The Pages pane appears.

   Figure 1-42 Pages pane of the Portal Editor

   
    

2. Click Add in the Pages pane. (You may need to scroll right to access the Add button.) The Page Definition window appears (Figure  1-43).

   Figure 1-43 Page Definition window

   
    

3. In the Portal page name field, enter My Page.

4. In the Available layouts list, select the threecolumn and fourcolumn layouts and click Add to move them to the Selected layouts list. Selecting more than one layout lets you switch between these layouts later.

5. In the Available portlets list, select BasicPortlet and use the arrow to move it to the Selected portlets list. The BasicPortlet is now available to the portal page "My Page".

6. Verify that the window looks like Figure  1-44, then click OK.

   Figure 1-44 Page Definition Page After Making Changes

   
    

7. On the E-Business Control Center tool bar, click the Save icon as shown in Figure  1-45.

   Figure 1-45 Save Icon

   
    

Note: Keep the E-Business Control Center Open.

Step 4C: Synchronize the Modified Portal

To use the new portal configuration, you must synchronize the E-Business Control Center data stored on your hard drive to the server.

1. In the E-Business Control Center, make sure your synchronization settings are correct. Choose Tools —> Project Settings. The Project Settings window appears (Figure  1-46).

Note: If you closed the E-Business Control Center, you need to restart it and open the sampleportal project file. See steps 1 through 4 of Step 2A: Create and Deploy the Portal for the procedure.

Figure 1-46 Project Settings Window

 

2. Make sure the following project settings are correct:

   1. On the General tab, make sure your Application Root Directory path is set to <BEA_HOME>\weblogic700\samples\portal\sampleportalDomain\
      beaApps\sampleportal.

   2. On the Connections tab, click Edit Connections, select the Default connection, then click Edit. The Connection Details window appears, as shown in Figure  1-47.

      Figure 1-47 Connection Details

      
       

   3. Make sure the Application Name field reads "sampleportal", and that the Server field reads "http://localhost:7501".

   4. Click OK in the Connection Details and then the Edit Connections window.

   5. On the Synchronization tab, deselect Validate the project and Show reset options for active campaigns. Click OK.

3. On the E-Business Control Center tool bar, click the Synchronize button. The E-Business Control Center will run the necessary processing tasks, as shown in Figure  1-48.

   Figure 1-48 Synchronization in Progress

   
    

4. When the Synchronizing Application window shows that synchronization is complete, click Close, as shown in Figure  1-49.

   Figure 1-49 Synchronization Complete

   
    

5. Close the E-Business Control Center.

Step 4D: Add New Skins, Layouts, and Portlets

Now that you have modified the portal to include new skins, layouts, and a portal page with a portlet, you will use these resources to make live modifications to the portal with the WebLogic Portal Administration Tools. To make these modifications, you will log in as the portal administrator you created in the previous procedure (portaladmin in this example).

Note: If you did not close your Portal Administration tools previously, click the Home icon and skip to step 3.

1. In your Web browser, navigate to the following URL:

   http://localhost:7501/sampleportalTools

   The login prompt appears, as shown in Figure  1-50.

   Figure 1-50 WebLogic Portal Administration Tools Login prompt

   
    

2. Log in to the tools. The default username and password combination is administrator/password.

3. In the Administration Tools Home page, click the icon on the Portal Management bar. The Portal Management Home page appears (Figure  1-51).

   Figure 1-51 Portal Management Home Page

   
    

4. On the Portal Management Home page, click Default Portal. The Group Portal Management Home page appears (Figure  1-52).

   Figure 1-52 Group Portal Management Home page

   
    

5. Click Select Skins (Figure  1-53). The Select Skins page appears:

   Figure 1-53 Select Skins page

   
    

6. On the Select Skins page, in the Unused Skins list, move the coologic skin into the Available Skins list.

7. With coologic selected in the Available Skins list, click the Set as Default button below the list to make coologic the default skin, as shown in Figure  1-53.

8. Click Save. You are returned to the Group Portal Management Home page.

9. Click the Manage Pages and Portlets link.

10. On the Pages and Portlets page, locate My Page in the Unused Pages list and click Attributes, as shown in Figure  1-54. The Set Page Attributes window appears.

    Figure 1-54 Pages and Portlets page

    
     

11. In the Set Page Attributes window, select the following options, as shown in Figure  1-55.

    • Available: Check this box to make the page available to the visitor.

    • Visible: Check this box to make the page visible to the visitor by default.

    • Visitor Editable Name: Check this box so that the page name can be modified by a visitor when they personalize their portal.

    • Use Image: Check this box so that an image will be used to display the page name (otherwise, the above display name will be used).

      Figure 1-55 Set Page Attributes

      
       

12. Click Save. You return to the Pages and Portlets page. Notice that My Page now appears in the Available Pages list.

13. Next to My Page, click Layouts. On the Select Page Layouts page, move fourcolumn from the Unused Layouts list to the Available Layouts list and click Save.

14. Next to My Page, click Edit Portlets. In the Portlets list, select BasicPortlet and click Set Attributes.

15. On the Set My Page Portlet Attributes page, set the following options, as shown in Figure  1-56:

    • Available: Check this box to make the portlet available to the visitor.

    • Visible: Check this box to make the portlet visible to the visitor by default.

    • Change the Display Name to Renamed Portlet.

      Figure 1-56 Set Page Portlet attributes

      
       

16. Click Save, then click Back at the bottom of the next page that appears. You are returned to the Pages and Portlets page.

Step 4E: View the Modified Portal

To view the modifications you have just made as a visitor would see them:

In a browser, go to:

http://localhost:7501/NewPortalWebApp/index.jsp.

Figure  1-57 shows the modified portal. Click the new "My Page" tab to view the renamed portlet.

Figure 1-57 Viewing the Modified Portal

 

 

---

Congratulations!

You've created your first portal. You have:

• Created and deployed a new portal

• Added a page called My Page to the portal

• Added a portlet to the new portal page with a renamed title

• Changed the default skin used in the portal

• Added a layout to the portal page that you can later switch to

Now that you have successfully created a portal and the resources to go with it, you are ready to advance to the other tasks that WebLogic Portal provides:

• Want to learn more about the tools. WebLogic Portal provides to developers, and how to use them? Refer to the Development Guide at http://download.oracle.com/docs/cd/E13218_01/wlp/docs70/dev/index.htm.

• If you're not a developer but will be assembling portals with WebLogic Portal, you can learn more about how to use the powerful administration tools in the Administration Guide at http://download.oracle.com/docs/cd/E13218_01/wlp/docs70/admin/index.htm.

• To go back to the main WebLogic Portal documentation page where you started this tutorial, just go to http://download.oracle.com/docs/cd/E13218_01/wlp/docs70/index.htm. On that page, you can see both the Administration Guide and Development Guide, as well as other useful information like the Migration Guide, supported platforms, and several tours of different aspects of WebLogic Portal.

• Creating a portal site is only a small part of using the WebLogic Portal platform. See the Administration Guide at http://download.oracle.com/docs/cd/E13218_01/wlp/docs70/admin/index.htm to learn how you can provide personalized access to the portals by creating group portals for your portal site. This allows for reuse of portal resources that are part of the portal web application and the ability to create role and business-specific portals for your enterprise's internal and external users.

  Whether you need to have an internal human resources portal that is accessible from your Intranet of a supplier portal that is accessible from your Internet site WebLogic Portal can support your enterprise's needs because of it's multi-portal architecture.