WebSphere Portal 7.0的主題與皮膚部署方法

  所謂主題與皮膚，主要指門戶系統的介面風格與顯示方式。在企業門戶專案的實施中，主題與皮膚的開發是重中之重。因為作為所有企業內外資訊、應用的統一入口，可謂是一個企業的臉面。從另一方面講，在一個企業內，沒有任何系統比門戶系統有更多的員工使用，在專案實踐中我也發現，花在主題與皮膚開發上面的時間往往佔很大的比重，對美工的要求也比較嚴格。

Portal 的主題與皮膚開發，說穿了還是普通 JSP 的開發，只不過大量使用了 IBM 自帶的標籤庫，而且頁面之間的呼叫非常複雜，初級開發者甚至找不到頁面元素所在的檔案，所以開發起來顯得比較麻煩。另外，各個版本的 Portal 其主題與皮膚構成元素都在變化，看起來似乎很難掌握。但是，如果你深刻洞悉了與主題、皮膚相關的幾個檔案之間的呼叫關係，使用起來就能遊刃有餘了。

2   WebSphere Portal 7.0的主題與皮膚部署方法

2 .1   主題與皮膚應用程式部署

WebSphere Portal 7.0 和 8.0 比較相似，相對於 6.0 來說有了較大的變化。由於 8.0 版本在國內的客戶不超過 3 家（截至 2013 年），而 7.0 版本的客戶較多且目前最流行，所以本節詳細介紹 IBM WebSphere Portal 7.0 的主題與皮膚開發。

2 .1.1   主題與皮膚應用程式（動態檔案）

使用工具： AnyClient 。

首先下載並安裝 AnyClient 工具。

  如果計算機上已經存在該工具，則可直接執行，介面如圖 2- 23 所示。

  單擊 “ File ”，選擇“ Site Manager ”，如圖 2- 24 所示。

  單擊左下角的 “ New ”按鈕，右側顯示了需要填寫的常規資訊，更改 Protocol 為 “ WebDAV ”，如圖 2- 25 所示。

圖 2- 23  AnyClient 介面

圖 2- 24   選擇“ Site Manager ”

圖 2- 25   常規資訊

按要求填寫資訊，如圖 2- 26 所示。其中， Host 表示計算機 IP 地址或者域名。

各常規選項如下。

—  Host ： 新增 ThemeList ， ；新增 SkinList ， ；新增 fs-type1 ， http://   hostname:10039/wps/mycontenthandler/dav/fs-type1/ 。

—  Username ： wpsadmin 。

—  Password ： wpsadmin 。

—  Protocol ： WebDAV 。

—  Local   Directory ： 選擇本地計算機需要上傳檔案的目錄。

—  Remote   Directory ： 不填。

—  Debug ： 不填。

—  Prompt for password ： 選填。

圖 2- 26   按要求填寫資訊

  待上述操作完成，開始檔案傳輸操作。

透過 ThemeList 傳輸主題檔案，例如： wanhua.default.theme ；透過 SkinList 傳輸皮膚檔案，例如： wanhua.default.Standard 。

上述檔案傳輸完畢後，動態檔案已經全部部署。

1.2   主題與皮膚應用程式（靜態檔案）

藉助應用程式打包工具，將主題與皮膚的靜態檔案打成 EAR 包 ，然後上傳到管理控制檯的 “應用程式型別”下的“ WebSphere 企業應用程式 ”中。這個過程比較簡單，這裡不再一一詳述。初學者如果不懂，則可以到 IBM 官方網站查閱入門教程。

檔案部署完成後，主題與皮膚即可用了。

2 .2   主題與皮膚檔案的匯出 / 匯入

透過 F lashFXP 工具進行主題與皮膚的匯出 / 匯入操作。配置檔案匯出 / 匯入中的 wpsadmin 為管理員賬號。

2 .2.1   配置檔案匯出

  使用 F lashFXP 工具連線到計算機上，如圖 2- 27 所示。

圖 2- 27   使用 FlashFXP 連線計算機

  進入到執行主題與皮膚命令所在的目錄，如圖 2- 28 所示。

圖 2- 28   進入到執行主題與皮膚命令所在的目錄

  將本地的 “ export.xml ”檔案上傳到該目錄下，透過 SecureCRT 工具連線到該機器，執行圖 2- 29 所示的命令，完成主題與皮膚的匯出。

圖 2- 29   執行命令

  配置檔案匯出完成。

2 .2.2   配置檔案修改

  完成 “配置檔案匯出”操作後，使用 F lashFXP 檢視時，右側會多出一個 Out_Export.xml 檔案，如圖 2- 30 所示。

圖 2- 30   檢視檔案

  選擇 Out_Export.xml 並下載到本地，修改或新增圖 2- 31 所示方框中的內容（放大後檢視）。

圖 2- 31   修改或新增內容

  修改完成後，儲存。配置檔案修改完成。

2 .2.3   配置檔案匯入

  配置檔案修改完成後，透過 FlashFXP 上傳至 目錄， 並使用 SecureCRT 工具上傳至伺服器，如圖 2- 32 所示。

圖 2- 32   執行命令

  配置檔案匯入完成。

2 .3   主題與皮膚應用程式的應用

  進入 P ortal 首頁的 “管理”中，單擊左側欄中的“主題和外表”，如圖 2- 33 所示。

圖 2- 33   主題和外表

  選擇 “主題”列表中的主題名稱，單擊 ，如圖 2- 34 所示。

圖 2- 34   設定預設的入口網站主題

  設定成功後，單擊右側的 “編輯主題”，如圖 2- 35 所示。

圖 2- 35   編輯主題

  將左側 “所有外觀”列表中所需要的 Skin 新增到右側列表中，並且選擇一種外觀，設定為預設值，如圖 2- 36 所法。

圖 2- 36   設定預設的外觀

  單擊 “確定”按鈕，完成主題與皮膚的設定，如圖 2- 37 所示。

圖 2- 37   完成主題與皮膚的設定

  主題與皮膚樣式應用成功。

2 .4   主題與皮膚修改檔案的上傳操作

（ 1 ）修改後的動態檔案

透過 AnyClient 工具連結到 fs-type1 上，依次找到 “ /themes/wanhua.default.theme/ ”，將對應的檔案上傳到相應的檔案目錄下即可。

（ 2 ）修改後的靜態檔案

透過 EAR 打包上傳到管理控制檯即可。