IBM Theme Builder Portlet 构建自定义门户
级别: 初级 Jaime Solari, 软件工程师, IBM Hawthorne, New YorkFenil Shah, 软件工程师, IBM Hawthorne, New York2005 年 7 月 21 日本文描述了如何..
级别: 初级
Jaime Solari, 软件工程师, IBM Hawthorne, New York
Fenil Shah, 软件工程师, IBM Hawthorne, New York
2005 年 7 月 21 日
本文描述了如何通过 IBM WebSphere Portal V5.1 的 Theme Builder 来快速自定义门户的外观,整个过程对编程经验没有要求。
引言
IBM WebSphere® Portal V5.1 的 IBM® Theme Builder V1.0(以下称为 Theme Builder)已经发布在 IBM WebSphere Portal Catalog 上。本文提供一个示例向您展示如何使用 Theme Builder 来自定义门户的外观。本文主要针对想要快速更改其门户环境外观的用户和管理员。
WebSphere Portal 提供了几个现成的主题和皮肤。在 WebSphere Portal 中,这些主题和皮肤提供页面和 Portlet 的外观。从头开始编写一个主题或皮肤,甚或编写一个基于现存主题的主题或皮肤需要一定的编程技能。通过允许您快速开始自定义门户的外观,Theme Builder Portlet 使这一过程变得更加容易。
使用 Theme Builder Portlet,您可以在很短的时间内提供基本品牌自定义以及简单主题和皮肤自定义。Portlet 提供一个预览窗口,显示当前主题在 WebSphere Portal 中的外观。您可以使用用户界面 (UI) 中的一组控件来更改显示在预览窗口中主题的外观。
本文展示了如何使用 Theme Builder 创建一个反映公司品牌的主题。
注:要理解和遵循本文所提供的步骤,可以在 WebSphere Portal V5.1 服务器上安装并运行 IBM Theme Builder Portlet。可以从 WebSphere Portal Catalog 下载 IBM Theme Builder。
理解主题和皮肤
要了解 WebSphere Portal 中的主题和皮肤的基本知识,请参阅 Creating a Distinctive Look and Feel for Your Portal。
Theme Builder 函数
Theme Builder 允许您自定义下列项,如图 1 所示。
- Banner
- Logo
- Row Navigation
- Tree Navigation
- Skin
图 1. 主题和皮肤的自定义元素

Theme Builder UI 概述
Theme Builder UI 包含用户选择区 (User Selection Area)、预览窗格 (Preview Pane) 和控件按钮 (Control Buttons) 区,如图 2 所示。
图 2. Theme Builder 用户界面

用户选择区包括三部分。要了解每一部分包含主题预览的哪一部分,请单击其标签旁边的预览光标,然后查看预览框。预览窗格的周围是一个闪烁的红色框。
- Logo 和 Banner 部分允许您在 WebSphere Portal 屏幕上部上传公司的徽标,更改相关的文本(例如公司名称),以及自定义管理链接的字体。
图 3. Logo 和 Banner 部分

- 导航模式 允许您通过一系列按钮和下拉列表选择主题的导航类型和布局。同组选择应用于行导航 (Row navigation) 和树导航 (Tree navigation)。
图 4. 导航模式

- Portlet 皮肤 部分允许您将缺省的皮肤与主题相关联。皮肤确定 Portlet 标题栏与边框的设计。使用 Theme Builder 中的控件,可以创建新的皮肤并将其与主题相关联。
[1] [2] [3] [4] 下一页
|