### Designing a Portlet

Each page within a portal can contains a set of nested pages, or portlets—user-specific resources on a portal page. Portlets provide access to specific applications or services, giving users access to multiple sources of information, business processes, and applications in a single place.

WebLogic Workshop makes it easy to create a portlet: click the target folder and choose File —> New —> Portlet. The Portlet Wizard steps you through the process of creating an initial portlet and opens it in the Portlet Designer.

The Portlet Designer is a graphic tool that enables you to design portlets such as the Employee portlet shown in the following figure. The Portlet Designer stores the portlet as an XML file.

Portlet Designer

The following table describes the portlet design tools shown in the previous figure.

Tools for Designing Portlets

Callout # | Use this tool... | For these tasks...
--- | --- | ---
1 | Application Window | Create, view, and edit portlet files in your portal application projects. The names of portlet files end in .portlet. The Portlet Designer stores the portlet as an XML file. You can view the portlet file in XML format within WebLogic Workshop by right-clicking the portlet file and selecting Open as XML from the drop-down menu when the Open as XML portal application property is enabled. To enable the Open as XML portal application property: Choose Tools —> Application Properties to open the Application Properties window. Select the Portal folder in the left-hand pane. Select the Is the Open as XML Option available? Portal option by clicking its checkbox. Select OK to apply the changes and close the Application Properties window.
2 | Design View | Design your portlet in this area.
3 | Palette Window | Add one of the following controls to the portlet: Help Mode—Adds an icon to the titlebar. Users click the icon to access help information. You set the associated Help URI value in the Property Editor window. Edit Mode—Adds an icon to the titlebar. Users click the icon to load a page that enables them to edit the contents of the current portlet. You set the associated Edit URI value in the Property Editor window to define the page that is loaded when the user clicks the Edit icon. New Preference—Adds customizable application properties at the developer level that can be exposed to the administrator and end user.
4 | Property Editor Window | Set properties for the portlet component that is currently selected. For example, you can set the Content URI property to identify the page flow or JSP that defines the initial content of the portlet. You can select a portlet component by clicking on it in the Design View canvas or by selecting its name in the Document Structure window (described below).
5 | Document Structure Window | View the components of the portlet interface in a hierarchical structure (see Figure: Document Structure Window for a Portlet). You can select a portlet component in the Document Structure window by clicking on it. The portal component is selected in Design View and you can edit its properties in the Property Editor window.

The following figure shows the Document Structure window for a portlet.

Document Structure Window for a Portlet

As shown in the Document Structure window, the following components make up the hierarchical structure of the sample Employee portlet interface:

- Titlebar—Defines the contents of the heading displayed (if enabled) above the portlet. Contents may include Icon, Help, and Edit URI values, and options for maximizing, minimizing, or deleting the portlet.
- Page Flow Content—Defines the page flow content of the portlet.
- Preferences—Defines custom preferences.

To learn more about designing portlets:

- View a demo, Designing a Portlet, that shows how to use the portlet design tools.
- See Portal Tutorials in the WebLogic Workshop Help.
- See Creating Portlets in the WebLogic Workshop Help.