Customizing the Look of Outlook Web Access

上一次修改主题： 2007-09-06

作者：Darcy Jayne

打动您的用户和管理人员的一种方式是，使用组织的徽标和颜色来自定义 Microsoft Office Outlook Web Access。自定义 Outlook Web Access 是帮助在许多用户使用的工具中构建组织标识的一种很好的方式。

本文将说明如何自定义登录页、语言选择页和注销页，以及如何使用自定义标题创建主题。如果要为组织创建进行较复杂更改的 Outlook Web Access 主题，请先了解一下级联样式表（.css 文件）的工作方式。清楚了解了 .css 文件后，每次更改一些元素，并测试所做更改，以确保获得预期结果。

主题中的内容

主题在 Outlook Web Access 选项中称为颜色主题，定义 Outlook Web Access 所使用的背景颜色、字体、突出显示颜色、图标和标题。默认情况下，在运行 Microsoft Exchange Server 2007 的计算机上安装客户端访问服务器角色时，将安装两个主题，默认主题是 Seattle Sky 和 Carbon Black。

每个主题是存储在客户端服务器上安装目录的 \Client Access\OWA\版本\themes 中的媒体文件和级联样式表（.css 文件）集合。每个主题存储在 \themes 各自的子目录中。

默认主题 Seattle Sky 是基本主题，位于 \themes\base 中。base 文件夹中包含定义主题所需的所有文件。这些文件包括 .css 文件、图形以及定义主题名称的 .xml 文件。通过将所选文件复制到新目录中并根据需要修改这些文件，可以创建其他主题。使用自定义主题时，会首先使用自定义主题目录中的元素，而任何未自定义的必要元素从基本主题中获得。例如，如果通过仅将标题图形复制到新主题并对其进行修改来创建新主题，则当用户选择该主题时，标题图形将从新主题中获得，而其余主题属性将从基本主题中获得。

Exchange 2007 SP1 新增功能

Outlook Web Access 在 Exchange Server 2007 Service Pack 1 (SP1) 中又增加了两个主题。两个新主题为 Xbox 和 Zune。

开始之前

建议您只要更改或创建 Outlook Web Access 主题，最好遵循下列原则：

• 务必在开始编辑文件之前备份原始文件，尤其是编辑 \themes\base 目录中的文件时更应如此。

• 请勿删除 \Client Access\OWA\版本\themes\base 文件夹或其中的任何文件。

• 请勿更改邮件顶部出现的信息栏，这些信息栏用于向用户警告有关可能有害的内容、仿冒攻击、病毒以及被阻止或丢失的内容等信息。

创建主题

先为新主题创建一个文件夹，然后将基本主题中的部分文件复制到新文件夹中。

1. 使用已委派了本地 Administrators 组成员身份的帐户登录到托管 Outlook Web Access 的客户端访问服务器。

2. 打开 Windows 资源管理器，然后找到 Exchange 服务器安装目录。

3. 在 \Client Access\OWA\<版本>\themes 中，新建一个文件夹并为其命名，例如 Fourth Coffee。

4. 将基本主题中的下列文件复制到新文件夹中：

   • premium.css

   • owafonts.css

   • logopt.gif

   • logopb.gif

   • nbbkg.gif

为新主题命名

可以通过两种方式为自定义主题命名。第一种方式是为新建主题所在的文件夹指定希望该主题使用的名称。例如，由于将新文件夹命名为 Fourth Coffee，新主题将自动命名为 Fourth Coffee。

也可以通过将基本主题中的 themeinfo.xml 文件复制到新文件夹中并编辑该文件，为该自定义主题命名。可以使用记事本等文本编辑器编辑 themeinfo.xml 文件，以将主题显示名更改为希望该主题使用的主题名称。themeinfo.xml 文件将覆盖作为主题名称的文件夹名。

若要使用 themeinfo.xml 文件为新主题命名，请执行下列操作：

1. 将 themeinfo.xml 文件从基本主题文件夹复制到名为 Fourth Coffee 的文件夹中。

2. 打开自定义主题文件夹中的 themeinfo.xml 副本。

3. 找到 theme displayname 值，并将该值更改为 Fourth Coffee Theme。

   该文件应显示 theme displayname = "Fourth Coffee Theme"。

4. 保存并关闭 themeinfo.xml。

注意：
如果更改了主题的名称，只有停止后再启动 IIS，更改才能生效。打开命令提示符窗口并使用命令 iisreset/noforce，可以完成此操作。

创建自定义标题

既然已复制了文件并且命名了主题，应尝试自定义标题。若要更改 Outlook Web Access 中的标题，将需要下列文件，这些文件已复制到新主题的文件夹中：

• premium.css

• owafonts.css

• logopt.gif

• logopb.gif

• nbbkg.gif

Premium.css 和 owafonts.css 定义 Outlook Web Access 使用的字体和颜色。Logopt.gif、logopb.gif 和 nbbkg.gif 是用于创建 Outlook Web Access 中位于页面顶部的标题的图像文件。

1. 先使用图像编辑工具打开并修改 logopt.gif。

2. 例如，将 logopt.gif 的背景颜色更改为 HTML RGB 值为 #DCBEC8 的紫红色。编辑 logopb.gif 和 nbbkg.gif，使其具有相同的背景颜色。

HTML RGB 颜色值通过七个字符组成的字符串定义，格式为数字标记 (#) 后跟六个字符组成的字符串。

若要测试自定义主题，登录到 Outlook Web Access 高级客户端（不要选择“使用 Outlook Web Access 基本客户端”选项），依次单击“选项”、“常规设置”，然后从“外观”菜单中选择自定义主题。必须保存所做更改，然后单击“刷新”以查看新主题。

下图说明用于为 Seattle Sky Outlook Web Access 主题创建标题的原始文件以及通过修改这些文件新建的标题。

Outlook Web Access 标题文件

Outlook Web Access 自定义标题

更改默认的 Outlook Web Access 主题

既然已新建主题并自定义了标题，应尝试将其设置为 Outlook Web Access 的默认主题。若要将默认 Outlook Web Access 主题从基本主题更改为自定义主题，将使用 Set-OwaVirtualDirectory cmdlet。对于后面部分的示例，将使用“FourthCoffeeCAS”作为服务器，使用“owa”作为虚拟目录，使用“Default Web Site”作为网站，使用“Fourth Coffee”作为文件夹名称。

• 若要将 Outlook Web Access 的默认主题设置为 Fourth Coffee，请运行以下命令：set-owavirtualdirectory -identity "fourthcoffeeCAS\owa (default web site)" -defaulttheme "fourth coffee"

注意：
如果文件夹名称中没有空格，可以省略引号。

如果任何用户已登录到 Outlook Web Access 并选择了某个主题，不会强制这些用户使用新主题。若要保证所有用户都使用新主题，必须禁用主题选择。也将使用 Set-OwaVirtualDirectory cmdlet 完成此操作。

• 若要在 Outlook Web Access 中禁用主题选择，请运行以下命令：set-owavirtualdirectory -identity "fourthcoffeeCAS\owa (default web site)" -themeselectionenabled $false

可以通过运行以下命令，同时完成两个命令： set-owavirtualdirectory -identity "fourthcoffeeCAS\owa (default web site)" -defaulttheme "Fourth Coffee" -themeselectionenabled $false

自定义登录页和注销页

自定义主题是在用户登录后提供 Outlook Web Access 自定义外观的一种很好的方式，但是自定义登录页立刻就会出现。Outlook Web Access 只使用基本主题的登录页、语言选择页和注销页。因此，必须通过修改基本主题文件夹中的文件来创建自定义页。

登录页、语言选择页和注销页所使用的文本样式、颜色和背景颜色由 logon.css 文件定义。通过组合存储为 .gif 文件的一组图像来创建这些页。下列文件用于创建登录页：

• logon.css

• lgnbotl.gif

• lgnbotm.gif

• lgnbotr.gif

• lgnexlogo.gif

• lgnleft.gif

• lgnright.gif

• lgntopl.gif

• lgntopm.gif

• lgntopr.gif

您将通过修改这些文件来为 Fourth Coffee 创建一组自定义登录页和注销页，从而创建新外观。为了保持页面的简单，将对所有图像中的背景使用纯色。

首先，在基本主题文件夹中新建一个文件夹，并将其命名为“backup”。将用于创建登录页和注销页的所有文件都复制到新文件夹中，以便在希望恢复原始的登录页和注销页时有备份副本。基本主题文件夹位于 Exchange 安装目录的 \Client Access\OWA\版本\themes\base。

下图显示默认的 Outlook Web Access 登录页，此时，用户单击了“显示说明”并且选择了“此计算机是私人计算机”和“使用 Outlook Web Access Light”。一幅图显示创建页面的图形文件如何配合在一起。另一幅图显示 logon.css 文件如何确定登录页上的背景和文本的颜色。

显示自定义图形文件的 Outlook Web Access 登录页

显示文本选项的默认 Outlook Web Access 登录页

下图显示默认的 Outlook Web Access 注销页。一幅图显示创建页面的图形文件如何配合在一起。另一幅图显示 logoff.css 文件如何确定注销页上的背景和文本的颜色。

显示自定义图形文件的 Outlook Web Access 注销页

显示文本选项的默认 Outlook Web Access 注销页

测试对登录页和注销页所做的更改

可以测试所做的更改，方法是在 Internet Explorer 中打开 Outlook Web Access 登录页，并使用下列步骤，在每次更改之后进行保存。

1. 在 Internet Explorer 中打开 Outlook Web Access 登录页或注销页，如果要测试对托管 Outlook Web Access 虚拟目录的客户端访问服务器上的默认网站所做的更改，可以打开 Internet Explorer 并输入 URL https://localhost/owa 进行测试。

2. 单击工具栏上的“工具”，然后单击“Internet 选项”。

3. 在“常规”选项卡上的“Internet 临时文件”下，单击“删除文件”，在系统询问您是否确实要删除所有 Internet Explorer 临时文件时，单击“是”。

4. 单击“确定”关闭“Internet 选项”。

5. 单击“刷新”查看所做更改。

每次更改了登录页或注销页的文件之后，重复上述步骤以查看所做更改。如果进行多项更改，可以保持登录页或注销页处于打开状态，然后重复步骤 2 到步骤 6 以查看所做更改。

自定义图像文件

既然已将原始文件安全地备份到单独的目录，并且了解如何查看所做的更改，可以修改作为登录页、语言选择页和注销页的图形构造块的 .gif 文件。

为此，使用图像编辑工具打开 lgntopl.gif，并根据新设计进行修改，如下图所示：

Fourth Coffee 徽标

由于以前将 lgntopl.gif 的背景颜色更改为 HTML RGB 值为 #DCBEC8 的紫红色，所以，将打开每个其他 .gif 文件并将其背景颜色更改为相匹配的颜色。

最后润色

既然已编辑了 .gif 文件，还必须编辑 logon.css 文件，以便背景相匹配。新的背景颜色也许并不很适合原始文本以及分隔线的颜色。除了将背景颜色设置为与新徽标相匹配之外，还将更改主要文本颜色和分隔线颜色，以便更适合新页。

所有这三种颜色（背景颜色、主要文本颜色和分隔线颜色）由 logon.css 中的 HTML RGB 值定义。若要将其更改为新颜色，必须在 logon.css 中找到这些颜色，并将其 HTML RGB 颜色值更改为所需的值。

若要更改颜色，在记事本等文本编辑器中打开 logon.css。搜索每个要更改的颜色元素的字符串，基于下表中的信息将 HTML RGB 值替换为新值，然后保存并关闭 logon.css。

登录页和注销页的元素及其说明

完成后，新的登录页和注销页将如下图所示。

Fourth Coffee 登录页

Fourth Coffee 注销页

详细信息

有关如何创建自定义 Outlook Web Access 主题的详细信息，请参阅如何创建 Outlook Web Access 主题。

Darcy Jayne - Microsoft Exchange Server 技术撰稿人