建立 Outlook Web App 的主題

  • 發行項

適用於：Exchange Server 2013

主題會定義 Microsoft Outlook Web App 使用的背景色彩、字型、醒目提示色彩、圖示和標頭。 每個主題都是媒體檔案和級聯樣式表單的集合， (.css) 儲存在 Microsoft Exchange 伺服器上 \Client Access\OWA\prem\version\resources\themes 中安裝目錄中的檔案。 每個主題都會儲存在其本身的 \themes 子目錄中。

默認主題位於 \Client Access\OWA\prem\version\resources\themes\base 中。 每個主題資料夾都包含定義主題所需的所有檔案。 這些檔案包括 CSS 檔案、圖形，以及定義主題名稱的 .xml 檔案。 建立其他主題的方式是將一個主題中的所有檔案複製到新資料夾，並視需要修改這些檔案。

根據預設，在您安裝 Exchange Server 2013 時會安裝多個主題，如下所示：

  • CSS (.css) 檔定義色彩、漸層及字型。

  • 影像 (.png) 檔案提供圖示和其他圖形元素。 如果您編輯任何圖示，請勿變更其大小。 如果您變更任何圖形元素的大小，請測試您的變更，以確認元素仍能正確地結合在一起。

這些檔案會儲存在 中安裝目錄 %ExchangeInstallPath%Client Access\OWA\prem\<version>\resources\themes的用戶端存取伺服器上。 每個主題都會儲存在主題的子目錄中。 您可以複製現有主題並修改複本，以建立其他主題。

建立主題之後，您可能也想要自訂 Outlook Web App 登入、語言選擇與錯誤頁面。

注意事項

Light 版 Outlook Web App 不支援主題。

警告

如果您有多個伺服器支援 Outlook Web App，則必須將自定義主題複製到每部伺服器。 您也應該建立自定義主題的備份複本。 如果您重新安裝或升級 Exchange，主題資料夾中的所有檔案都會被覆寫。 重新安裝或升級完成之後，您必須將主題複製回適當的資料夾

在您開始建立自訂主題之前，備份將會變更的所有檔案。

開始之前有哪些須知？

  • 完成此工作的預估時間：60 分鐘。

  • 您必須已獲指派權限，才能執行此程序或這些程序。 To see what permissions you need, see the "Outlook Web App virtual directories" entry in the Clients and mobile devices permissions topic.

  • 您需要有本機伺服器系統管理員權限，才能執行這些程序。

  • 您需要文字編輯器來變更預設色彩，並需要圖形編輯器來變更影像。 如果您必須比對特定色彩，而且在 [色彩數據表] 中找不到相符的色彩，您可以使用影像編輯工具來取樣色彩並判斷其 HTML RGB 值。

  • 建議的最佳作法是，只要是變更或建立 Outlook Web App 主題，就使用下列指導方針：

    • 如果決定編輯現有的主題，請在開始編輯之前，先備份原始檔案。

    • 請勿刪除 \Client Access\OWA\prem\version\resources\themes\base 資料夾或其中的任何檔案。

  • 如需適用於此主題中程序的快速鍵相關資訊，請參閱 Exchange 系統管理中心的鍵盤快速鍵。

提示

有問題嗎？ 在 Exchange 論壇中尋求協助。 瀏覽 Exchange Server 的論壇。

步驟 1：建立新的 Outlook Web App 主題

若要開始，要先建立新主題的資料夾，然後將現有主題中的檔案複製到新資料夾中。

  1. 使用委派了本機 Administrators 群組成員資格的帳戶，登入主控 Outlook Web App 虛擬目錄的 Exchange Server。

  2. 開啟 Windows 檔案總管，找到 Exchange 伺服器安裝目錄。

  3. 在 \Client Access\OWA\prem\version\resources\themes 中，建立新資料夾並將它命名為 ，例如 Fourth Coffee。

  4. 將其他主題中的所有檔案複製到新資料夾中。

步驟 2：為您的新主題命名

若要設定新主題的顯示名稱，請執行下列工作：

  1. 開啟自訂主題資料夾中剛才建立的 themeinfo.xml 複本。

  2. 尋找主題 displayname 值，並將值變更為您想要使用的名稱。 例如 displayname = "Fourth Coffee Theme"。

  3. 儲存及關閉 themeinfo.xml。

步驟 3：變更新主題的排序順序 (選擇性)

如有需要，您可以編輯 themeinfo.xml 檔案來變更新主題的排序順序。 排序順序會決定 [設定] 選單中 [ 變更主題 ] 面板中的主題位置。

若要使用 themeinfo.xml 檔案變更新主題的排序順序，請執行下列工作：

  1. 開啟自訂主題資料夾中 themeinfo.xml 的複本。

  2. 尋找主題 sortorder 值，並變更值以反映您希望新主題出現在清單中的位置。 主題會依數值以遞增順序排序。 根據預設，基底主題是第一個主題，其 sortorder 值為 “0”。 例如 sortorder="<number>"。

  3. 儲存及關閉 themeinfo.xml。

步驟 4：修改新主題

現在您已在檔案上複製並命名您的主題，您可以自定義它。 您可以在 Outlook Web App 主題中自訂下列元素：

  • 影像檔，用於定義標頭區域和圖示。

  • CSS 檔，用於定義字型和色彩。

影像檔

主題影像會儲存在 \themes_\theme name>_\<images\ 的兩個資料夾中。 \images\0 資料夾包含將用於左至右語言的影像， (例如英文) ，而從右至左讀取的語言則會使用 \images\rtl 資料夾中的影像。

注意事項

\images\rtl 資料夾中有些影像與 \images\0 資料夾中的影像相同，但為鏡像影像。

若要自訂主題，可使用影像編輯工具來開啟和修改下列影像：

  • Headerbgmain.png

    這是主要標頭影像。 建議影像不要超過 30 像素的標頭高度。 默認主題不會使用背景影像，因此此影像是透明的。 如需具有自定義背景影像的主題範例，請參閱 藍圖 主題資料夾中的影像。

  • Headerbgright.png

    這會當做標頭後方的圖格影像使用。 默認主題不會使用底圖背景影像，因此此影像是透明的。 如需具有自定義圖格背景影像的主題範例，請參閱 藍圖 主題資料夾中的影像。

  • sprite1.mouse.png

    這包含主題中使用的大部分影像。 您可以變更影像的色彩以符合您的主題，也可以變更預設 Outlook Web App 文字標誌。

    為了避免發生問題，請勿變更小精靈中個別圖示的大小，並確保已儲存為透明的 .png 檔案。

  • themepreview.png

    此影像將用來表示 Outlook Web App 的 [設定] 功能表中 [變更主題] 面板中的主題。

色彩和字型

階層式樣式表單 (.css) 檔案會定義主題中使用的色彩和字型，並儲存在 \themes\<theme name> 底下的多個資料夾中。 \<theme name>\0 資料夾包含.css檔案，這些檔案將用於左至右語言， (例如英文) ，而從右至左讀取的語言則會使用 \<theme name>\rtl 資料夾中的.css檔案。 也有語言特定的資料夾，例如 (\ja、\ko、\zhs 和 \zht) ，其中包含要與這些語言搭配使用的.css檔案。

從修改 \<theme name>\images\0 資料夾開始。 您可以自訂每個主題中使用的四種色彩。

  • BrandColor：#0072C6
  • NavBarHoverColor：#4C9CD7
  • UnreadColor：#2A8DD4
  • FocusColor：#DFEDFA

您可以使用記事本之類的文本編輯器，以下列兩個檔案中的主題色彩來搜尋和取代這些值的所有實例：owa2styles.mouseCSS 和 owa2styles2.mouseCSS。 這必須在新主題中包含這些.css檔案的每個資料夾中完成。

步驟 5：設定預設 Outlook Web App 主題

設定新的預設主題，只會影響尚未透過 Outlook Web App 的 [設定] 功能表變更其主題的使用者。

若要強制所有使用者採用預設主題，除了設定預設主題，您還必須禁止選擇主題。

使用命令介面設定 Outlook Web App 的預設主題

本範例會設定 Outlook Web App 的默認主題，其中伺服器名稱為 fourthcoffee、虛擬目錄名稱為 owa、網站名稱為 default web site，而主題位於名為 的檔Custom夾中。

set-owavirtualdirectory -identity "fourthcoffee\owa (default web site)" -defaulttheme Custom

如需詳細的語法及參數資訊，請參閱 Set-OwaVirtualDirectory。

使用命令介面停用 Outlook Web App 的主題選取功能

本範例會停用 Outlook Web App 中的主題選取，其中伺服器名稱為 fourthcoffee、虛擬目錄名稱為 owa，而網站名稱為 default web site。

set-owavirtualdirectory -identity "fourthcoffee\owa (default web site)" -themeselectionenabled $false

您也可以同時完成這兩個命令，如下列範例所示：

set-owavirtualdirectory -identity "fourthcoffee\owa (default web site)" -defaulttheme Custom -themeselectionenabled $false

如需詳細的語法及參數資訊，請參閱 Set-OwaVirtualDirectory。

步驟 6：執行 iisreset/noforce 以儲存變更

如果您新增或變更主題、變更主題的名稱，或變更主題的排序順序，您必須停止並啟動 Internet Information Services (IIS) ，變更才會生效。 若要這樣做，請在您已建立新主題的伺服器上開啟命令提示字元視窗，然後執行 命令 iisresest /nforce。

如何才能了解此工作是否正常運作？

  1. 使用您已建立新主題之伺服器上的虛擬目錄登入 Outlook Web App。 如果您要在裝載 Outlook Web App 虛擬目錄的 Exchange 伺服器上測試預設網站的變更，您可以開啟 Internet Explorer 並輸入 URL https://localhost/owa來測試主題。

  2. 選取 [設定] 功能表 > [變更主題]，然後選取您的自定義主題，以切換至您的自定義主題。

如果您沒有看到最近所做的變更且已執行 iisreset/noforce

  1. 在 Internet Explorer 工具列上，選取 [設定] 選單 > [因特網選項]。

  2. 在 [ 一般] 索引標籤 的 [瀏覽歷程記錄] 下，選取 [ 刪除]，然後確認已核取 [暫時因特網檔案] 和 [網站檔案 ]。 然後選取 [刪除 ] 以移除這些檔案。

  3. 選取 [確定]，關閉 [網際網路選項]。

  4. 選取 [重新整理] 以查看變更。

您可能必須重複這些步驟，以在每次變更主題檔案時查看您的變更。 如果您要進行數項變更，您可以讓 Outlook Web App 開啟，並在伺服器上重複執行 iisreset/noforce，並視需要從 Internet Explorer 清除暫存盤。