cmd

導(dǎo)航

<

2009年5月

>

日

一

二

三

四

五

六

26

27

28

29

30

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

1

2

3

4

5

6

統(tǒng)計(jì)

隨筆 - 13
文章 - 44
評(píng)論 - 9
引用 - 0

常用鏈接

留言簿(2)

隨筆檔案

文章分類

文章檔案

收藏夾

搜索

閱讀排行榜

評(píng)論排行榜

IBM Websphere Portal 主題與皮膚開發(fā)

內(nèi)容簡(jiǎn)介：
Portal 的主題與皮膚開發(fā)說穿了還是普通jsp的開發(fā)，只不過大量使用了ibm自帶的標(biāo)簽庫(kù)，開發(fā)起來顯得比較麻煩。但是，如果您深刻洞悉了與主題、皮膚相關(guān)的這幾個(gè)文件之間的調(diào)用關(guān)系，使用起來就能運(yùn)用自如了。這里是作者從大量的項(xiàng)目經(jīng)驗(yàn)中總結(jié)出的幾點(diǎn)體會(huì)，貢獻(xiàn)出來，希望與大大家分享。
在這篇文章里我想從以下幾個(gè)方面來介紹websphere portal的主題與皮膚開發(fā)：
1、初級(jí)入門：什么是Portal的主題與皮膚開發(fā)？
2、中級(jí)開發(fā)：如何更換Portal系統(tǒng)的logo圖標(biāo)；
3、中級(jí)進(jìn)階：開發(fā)個(gè)性化的主題；
4、高級(jí)探索：開發(fā)自適應(yīng)分辨率的主題與皮膚；
5、高手過招：更改Portal系統(tǒng)的登錄方式；
6、Portal的皮膚開發(fā)簡(jiǎn)介。

一、初級(jí)入門：Portal的主題與皮膚開發(fā)：

要了解如何開發(fā)portal的主題，首先要了解websphere portal的顯示流程。IBM WebSphere Portal 使用不同的 Java Server Page（JSP）、級(jí)聯(lián)樣式表（Cascading Style Sheet，CSS）和圖像來顯示門戶頁(yè)面。它使用位于X:\WebSphere\AppServer\installedApps\ YourComputerName \wps.ear\wps.war 目錄下 themes、skins 和 screens 目錄中的 JSP 來構(gòu)造門戶頁(yè)面。這些目錄中的每一個(gè)都包含 html、wml 和 chtml 子目錄，WebSphere Portal 將它們用于服務(wù)不同客戶機(jī)，例如桌面瀏覽器和移動(dòng)設(shè)備。我們這里以通常使用的html方式下的主題開發(fā)為例，介紹Portal的主題開發(fā)。

用于顯示門戶頁(yè)面的 JSP 流程：本文描述了缺省主題定義的 Default.jsp、Head.jsp 、AdminLinkBarInclude.jsp、 ToolBarInclude.jsp、PlaceBarInclude.jsp、PageBarInclude.js以及延伸出來的 PageBeginInclude.jsp、 PageEndInclude.jsp的內(nèi)容和流程。下面簡(jiǎn)單介紹這幾個(gè)jsp。注意：這部分內(nèi)容屬于最初級(jí)的開發(fā)，您要弄懂這些介紹，必須具備一定的 jsp基礎(chǔ)、css基礎(chǔ)和標(biāo)簽庫(kù)的基礎(chǔ)，最好做過相應(yīng)的開發(fā)。
1、Default.jsp：
所有屏幕聚集都從 Default.jsp 開始。用于缺省主題的 Default.jsp 位于wp_root\app\wps.ear\wps.war\themes\html。這個(gè) JSP 包含其它用于顯示標(biāo)題、公司徽標(biāo)、工具欄的 JSP 以及用于往可用位置及頁(yè)面植入內(nèi)容的 JSP。在 Default.jsp 的末尾處，screenRender JSP 標(biāo)記選擇被請(qǐng)求的屏幕（例如 login 或 forgotpassword）。以下介紹的jsp是以這樣的順序先后調(diào)用的。
2、Head.jsp
Head.jsp 生成標(biāo)題并嵌入指向樣式表文件的鏈接。它還定義了支持 BIDI（雙向）文本所需的變量。這個(gè) JSP 的內(nèi)容將在這里描述。您也可以通過<title></title>在這里定死portal網(wǎng)站的標(biāo)題，這比IBM公布的以標(biāo)簽的方式寫來的容易，也更易使用。如果您開發(fā)了多套主題，而且這幾套主題的page title如果也一樣的話（除了虛擬門戶，一般是這樣子），您可以把這幾個(gè)文件放到themes/html的根目錄下，其他主題的default.jsp 都來調(diào)用這個(gè)文件就可以了。

3、AdminLinkBarInclude.jsp
        AdminLinkBarInclude.jsp主要用來顯示了“新建頁(yè)面”、“編輯頁(yè)面”、“分配頁(yè)面許可權(quán)”三個(gè)標(biāo)簽
4、ToolBarInclude.jsp
ToolBarInclude.jsp 顯示歡迎消息以及為用戶提供的鏈接工具欄。門戶網(wǎng)站上顯示什么樣的鏈接工具欄取決于用戶上下文。例如，登錄的用戶看到“我的門戶網(wǎng)站”、“管理”（盡管理員可見）、“編輯我的‘概要文件’”、“注銷”等之類的鏈接；而注銷的用戶看到 “忘記密碼”、“登錄”、“幫助” 之類的鏈接。
5、PlaceBarInclude.jsp
PlaceBarInclude.jsp 用來顯示一級(jí)菜單，即“首頁(yè)”、“文檔管理器”、“公司概況”、“業(yè)務(wù)簡(jiǎn)介”等，屬于最高層的目錄，您在任何一個(gè)一級(jí)菜單上都可以通過“新建頁(yè)面”來創(chuàng)建二級(jí)菜單，你創(chuàng)建的內(nèi)容將被存儲(chǔ)到數(shù)據(jù)庫(kù)（原始使用的是cloundscape），您也可以把它倒入到db2、oracle等任何一個(gè)portal所支持的數(shù)據(jù)庫(kù)中，此內(nèi)容將在我的下一篇文章中詳細(xì)論述，這里不再一一提及。

6、PageBarInclude.jsp
用來顯示二級(jí)菜單，當(dāng)您點(diǎn)擊一級(jí)菜單中的任一標(biāo)簽時(shí)，系統(tǒng)會(huì)調(diào)用該文件，并檢索出該菜單的所有子菜單，默認(rèn)顯示在PlaceBar的下面。

二、中級(jí)開發(fā)：如何更換Portal系統(tǒng)的logo圖標(biāo)；
1、Default.jsp的工作原理：

我們看這個(gè)例子，Default.jsp大致上將Portal系統(tǒng)的默認(rèn)頁(yè)面劃分為這樣一個(gè)表格：

表-1： Default.jsp總體調(diào)用效果

PageBegin: 用來顯示頁(yè)面生成以前的提示文字，例如：Portal系統(tǒng)正在加載，請(qǐng)稍候……
Portal系統(tǒng)主體部分：用來顯示詳細(xì)的Portal頁(yè)面；
PageEnd.jsp用來顯示頁(yè)面生成以后的東西。例如公司版權(quán)信息等。

表-2：Portal系統(tǒng)正文部分的調(diào)用關(guān)系：
徽標(biāo)部分，在default中調(diào)用我的門戶菜單，在ToolBar中調(diào)用
個(gè)性化菜單，在AdminLink中調(diào)用

Portal的Body部分，用來顯示各個(gè)portlet以及高層次的三級(jí)菜單。
頁(yè)面的結(jié)尾，用來顯示公司版權(quán)信息等。


2、換一個(gè)logo：
打開Default.jsp，您會(huì)開到一個(gè)表格，在表格的左上角，有這樣一段語(yǔ)句，用來顯示默認(rèn)主題的Logo徽標(biāo)：

<td width="100%" valign="top" align="<%=bidiAlignLeft%>" nowrap>
         <img align="absmiddle" alt='<wps:text key="title" bundle="nls.engine">Portal Title</wps:text>' title='<wps:text key="title" bundle="nls.engine"/>' src='<wps:urlFindInTheme file="logo.gif"/>'>
             <a href="#wpsMainContent"><img width="1" height="1" border="0" src='<%= wpsBaseURL %>/images/dot.gif' alt='<wps:text key="link.skiptocontent" bundle="nls.engine"/>' title='<wps:text key="link.skiptocontent" bundle="nls.engine"/>'>
</a>
      </td>
   上面已經(jīng)介紹過，整個(gè)Portal系統(tǒng)的頁(yè)面由Default.jsp分割成一個(gè)大的表格，用來顯示或者調(diào)用不同的jsp。我們?cè)谶@個(gè)大表格的最左上角化出一個(gè)<td>,用來顯示公司的徽標(biāo)。這段語(yǔ)句就是在這個(gè)單元格內(nèi)插入一個(gè)圖片，叫做Logo.gif。
明白了嗎？您可以將這個(gè)文件名改稱您想插入的任意一張圖片的名字，只要將這張圖片放到.war/images/目錄下就可以了。這里支持幾乎所有的圖片格式，您可以任意擺放，大小、位置等都有您說了算。到這里，您可能已經(jīng)想到了：那么，我養(yǎng)插入一個(gè)Flash呢？別著急，下面將會(huì)提到這點(diǎn)。
3、用flash作logo：
      用Flash作徽標(biāo)是個(gè)不錯(cuò)的注意，它可以使您的門戶網(wǎng)站看起來更豐富、生動(dòng)一些。但是，F(xiàn)lash，也就是.swf格式的文件，是不能直接通過這種方式來插入的，因?yàn)槲覀兊臑g覽器并不能識(shí)別它。要插入一個(gè)動(dòng)畫，必須位置制定相應(yīng)的驅(qū)動(dòng)。您可以用以下這段代碼，為之生成：

<td width="510" border="0" cellpadding="0" cellspacing="0" height="81" valign="middle" align="left">
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="510" height="81">
               <param name=movie value="<%= wpsBaseURL %>/images/firstpagelogo.swf">
               <param name=quality value=high>
                    <embed src="firstpagelogo.swf" quality=high pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="510" height="81">
                    </embed>
</object>
</td>

這里在插入了一個(gè)名字為firstpagelogo.swf的影片做公司徽標(biāo)，他的大小是 510*81，請(qǐng)將這個(gè)影片文件放在.war/images目錄下，重啟服務(wù)器，看看您的首頁(yè)上，是不是已經(jīng)出現(xiàn)了？

三、中級(jí)進(jìn)階：開發(fā)個(gè)性化的Portal主題
1、理解、開發(fā)各級(jí)菜單；
Default.jsp 調(diào)用PlaceBarInclude.jsp文件來顯示一級(jí)菜單，如果一級(jí)菜單下面還有二級(jí)菜單，那么當(dāng)您點(diǎn)擊該一級(jí)菜單是，Default將調(diào)用 PageBarInclude.jsp來顯示二級(jí)菜單。當(dāng)然，您也可以不再調(diào)用該文件，那么系統(tǒng)將缺省調(diào)用Portlet的皮膚里面的 LayerContainer.jsp文件，用來以三級(jí)菜單代替二級(jí)菜單，這便是個(gè)性化的左側(cè)管理菜單。
打開這兩個(gè)文件，您會(huì)發(fā)現(xiàn)里面的內(nèi)容非常簡(jiǎn)單。請(qǐng)看下面的清單：
l 首先由這樣一個(gè)標(biāo)簽：
<wps:if navigationAvailable="yes" screen="Home,LoggedIn,LoggedOut">
        意思是如果菜單時(shí)可用的，那么當(dāng)您登錄進(jìn)去以后將執(zhí)行如下操作。使用這句代碼，必須引入Portal的標(biāo)簽庫(kù)，具體的過程這里不再贅述。接下來繪制了一個(gè)表格，用來顯示里面的操作。表格內(nèi)的內(nèi)容，下面將作介紹。
l 菜單的左右協(xié)調(diào)：如果您一共定義了十幾個(gè)一級(jí)菜單，而一欄只能顯示8個(gè)，剩下的菜單怎么辦？我們?cè)谶@里放置了兩個(gè)三角形的小圖標(biāo)，如果右邊還有更多的菜單，小圖標(biāo)會(huì)自動(dòng)出現(xiàn)，當(dāng)您點(diǎn)擊時(shí)，就會(huì)顯示出剩余的菜單。具體的代碼是通用的，這里不再贅述。我們需要強(qiáng)調(diào)的是：菜單條在這里支劃分為兩種情況：一是選中的情況下，一是為選中的情況下，即：
      <wps:if nodeInSelectionPath="yes">
        <table>這里用來顯示選中該菜單的情況下該菜單條的顯示方式。</table>
</wps:if>
<wps:if nodeInSelectionPath="no">
        <table>這里用來顯示未選中該菜單的情況下該菜單條的顯示方式。</table>
</wps:if>
例如：
<td Background="<%= wpsBaseURL %>/images/title_back01.jpg" height="30">
   <img border="0" src='<%= wpsBaseURL %>/images/b01.jpg' alt="">
<a href='<%=wpsNavModelUtil.createSelectionChangeURL(wpsNavNode)%>' class="wpsSelectedPlaceLink">
<%= com.ibm.wps.model.LocaleHelper.getTitle((com.ibm.portal.Localized)wpsNavNode, com.ibm.wps.engine.RunData.from( pageContext.getRequest()).getLocale())%>
</a>
<img border="0" src='<%= wpsBaseURL %>/images/b01.jpg' alt="">
</td>
我們首選添加一張背景圖片，然后左側(cè)放一張前綴，中間打印該菜單條的名字，后面又放一張圖片做后綴，這樣整個(gè)菜單條看起來就非常漂亮了。
l 接下來是顯示工具欄的情況下：
<wps:if showTools="yes">這里的操作將使具有權(quán)限的用戶通過點(diǎn)擊這張圖片，直接編輯相應(yīng)的portal頁(yè)面。不過據(jù)筆者的開發(fā)經(jīng)驗(yàn)，大部分的用戶會(huì)隱藏掉這個(gè)入口，以免引起管理上的混亂，具體的開發(fā)內(nèi)容將在以后的文章中提及，智利將不再詳細(xì)介紹。
l 最后的代碼用來顯示系統(tǒng)收藏夾：
當(dāng)您登錄后，會(huì)發(fā)現(xiàn)在一級(jí)菜單的最右邊多出一個(gè)“我的最愛”的東西，這是portal系統(tǒng)自帶的收藏夾，您可以通過這個(gè)入口將自己喜歡的頁(yè)面添加到您的收藏夾，然后您就可以通過點(diǎn)擊這里直接進(jìn)入到你收藏的頁(yè)面了。

2、開發(fā)個(gè)性化工具欄
      要獲得個(gè)性化的工具欄，您可以修改ToolBarInclude.jsp這個(gè)文件。這個(gè)文件提供了Portal管理員進(jìn)到管理界面的入口。
在這里你可以編輯自己的“概要文件”，就個(gè)人的用戶信息，修改自己的姓名、密碼等。更深一層的話，您可以在這里顯示歡迎信息，例如張三同志登錄后，會(huì)打印出：“歡迎您，張三同志！”的語(yǔ)句。要實(shí)現(xiàn)這個(gè)功能實(shí)際上非常簡(jiǎn)單，請(qǐng)看：
        <font color="#FF0000" size="5"><strong>
               <wps:if loggedIn="yes" screen="Home,LoggedIn">
                     <wps:text key="welcome" bundle="nls.engine">
                           <wps:textParam><wps:user attribute="givenName"/></wps:textParam>
                           <wps:textParam><wps:user attribute="familyName"/></wps:textParam>
                     </wps:text>
                </wps:if>
         </font>
當(dāng)然，您需要引入相應(yīng)的標(biāo)簽庫(kù)，具體的應(yīng)用屬于普通的jsp開發(fā)，您可以參照平常的開發(fā)經(jīng)驗(yàn)去實(shí)現(xiàn)。
3、開發(fā)個(gè)性化的管理標(biāo)簽
     所謂的個(gè)性化指的是，您可以刪掉管理標(biāo)簽的一個(gè)或者多個(gè)，也可以根據(jù)喜好添加自己需要的標(biāo)簽。這需要您來修改AdminLinkBarInclude.jsp文件。例如：
<td valign="middle" align="<%=bidiAlignRight%>" nowrap>
    <a href="<% wpsURL.write(out); %>" class="wpsLinkBarLink">
      <wps:text key="link.createpage" bundle="nls.engine"/>
</a>
   </td>
    這段代碼用來顯示“新建頁(yè)面”的管理標(biāo)簽，通過電機(jī)這個(gè)標(biāo)簽，您可以為當(dāng)前頁(yè)面創(chuàng)建一個(gè)子頁(yè)面。同理，您可以個(gè)性化“編輯頁(yè)面”和“分配頁(yè)面權(quán)限”，當(dāng)然，您也可以之間隱藏掉這個(gè)入口。

四、高級(jí)探索：開發(fā)自適應(yīng)分辨率的主題與皮膚
1、開發(fā)1024下的主題
     剛安裝完P(guān)ortal系統(tǒng)后，剛才介紹的幾個(gè)jsp會(huì)在默認(rèn)的.war/theme目錄下，您可以新建一個(gè)文件夾，將這幾個(gè)jsp文件拷貝至該目錄下，然后在管理界面下添加該主題。該主題默認(rèn)下就是1024的。您可以開發(fā)多套主題，注意：請(qǐng)充分利用一些公共的資源，例如這些主題可能使用的是同樣的版權(quán)信息，這樣，您可以將PageEnd.jsp頁(yè)面放到themes/entention下，然后讓所有的主題調(diào)用這個(gè)文件。
當(dāng)然，為了保險(xiǎn)起見，您可以在Default.jsp最外層的表格中這樣寫死：
   <table>
<tr>
<td width=”1024”>
具體的調(diào)用！
</td>
         </tr>
    </table>

2、開發(fā)800分辨率下的主題
     開發(fā)800下的主題說穿了非常簡(jiǎn)單，您可以會(huì)出這么一個(gè)表格：
        <table>
<tr>
<td> </td>
<td width=”800” align=”center” valign=”top”>
   將Default.jsp中最外層的table里面所有的內(nèi)容拷貝到這里！
</td>
<td> </td>
             </tr>
         </table>
      將這個(gè)表格覆蓋到原來Default.jsp文件中最外層的表格就可以了。注意：在default.jsp中調(diào)用的各個(gè)文件中，可能都有表格存在，如果這些表格中有的寬度超過了800，或者兩個(gè)并列一行的表格寬度超過了800，請(qǐng)適當(dāng)調(diào)小。
3、開發(fā)1024和800下自適應(yīng)得主題
     要開發(fā)自適應(yīng)的主題就更簡(jiǎn)單了！請(qǐng)?jiān)O(shè)定一個(gè)變量w,先寫一個(gè)JavaScript，用來讀取客戶端的瀏覽器分辨率，如果是800的，則給給變量賦值w=800，反之如果是1024的，就給賦值為w=1024。剩下的事，不用我說了吧！
五、高手過招：更改Portal系統(tǒng)的登錄方式；
1、從首頁(yè)上登錄
      您需要用wsad開發(fā)一個(gè)portlet，并在jsp中寫一個(gè)代理，將用戶憑證提交給系統(tǒng)自帶的認(rèn)證action中。這個(gè)portlet可以這樣來設(shè)計(jì)：
     <wps:if loggedIn="no"> //如果沒有登陸的情況下，提醒用戶輸入它的用戶名與密碼：

     </wps:if>
     用戶按下“登錄“后，將用戶名和密碼提交到系統(tǒng)自帶的action中：
<form method="POST" action='/wps/portal/!ut/p/.cmd/li' enctype="application/x-www-form-urlencoded" name="LoginPage">
    //在這里將用戶名和密碼付給系統(tǒng)自帶的登錄框。
</form>
<wps:if loggedIn="yes"> //如果已經(jīng)登陸了，可以顯示用戶的常用信息，比如，讀取用戶的Lotus郵箱，然后顯示他喲年級(jí)封郵件等：

甚至，您可以利用url-mapping自定義幾個(gè)頁(yè)面，從首頁(yè)上直接進(jìn)入到您的業(yè)務(wù)系統(tǒng)（如上）。
這樣的話，您甚至可以封死portal頁(yè)面右上角自帶的“登錄”標(biāo)簽，也許您會(huì)問我又想用系統(tǒng)自帶的頁(yè)面呢？沒關(guān)系，您也可以在瀏覽器中輸入：http: //machinename:9081/wps/myportal，當(dāng)然，干脆您直接輸入一個(gè)錯(cuò)誤的用戶名和密碼，系統(tǒng)自然后帶您會(huì)帶系統(tǒng)自帶的頁(yè)面了。
2、拒絕從系統(tǒng)自帶的登錄界面
      但是在上面這種情況下，可能會(huì)出現(xiàn)這種情況：當(dāng)用戶名或者密碼錯(cuò)誤的時(shí)候，系統(tǒng)會(huì)返回到系統(tǒng)自帶的登錄框上面，為避免這種情況，您可以封死這個(gè)開關(guān)。這個(gè)非常簡(jiǎn)單，我在這里順便一提：
      系統(tǒng)自帶的登錄頁(yè)面是.war/screen/html下的login.jsp文件，您可以刪掉該文件里的所有內(nèi)容，然后加入這么一句：
<script language="JavaScript">
    alert("用戶名或者密碼輸入有誤，請(qǐng)重新輸入！");
    window.location='http://xxjsb-scdd2.portal.com:9081/wps/portal';
</Script>
呵呵，是不是帶您又回到了首頁(yè)呢？是的，確實(shí)如您所想，這樣就封死了系統(tǒng)自帶的登錄頁(yè)面。如果您的用戶名和者密碼錯(cuò)誤，或者您通過myportal直接調(diào)用，都不起作用了吧！系統(tǒng)會(huì)帶您回到首頁(yè)的登錄界面，請(qǐng)重新輸入！

3、遺留問題：
   在實(shí)際開發(fā)中，您也許會(huì)發(fā)現(xiàn)還有其他一些意想不到的問題，是的，這個(gè)地方確實(shí)有許多值得注意的地方，也許只有您親自來試過了，才知道其中的玄機(jī)。我也希望在開發(fā)中大家相互交流，把發(fā)現(xiàn)的好地方貢獻(xiàn)出來，大家一起分享。好吧，祝您成功！

六．主體開發(fā)的調(diào)試
調(diào)試主題與皮膚一般采用兩種方法，一是修改reload，一是復(fù)制法：

1、修改reload法。我們知道，portal系統(tǒng)的主題一切都是從default.jsp聚焦的，在通常的應(yīng)用服務(wù)器上都有一個(gè)reload開關(guān)，用以控制服務(wù)器是否自動(dòng)更新，ibm websphere portal也不例外。如果我們打開這個(gè)開關(guān)（這個(gè)開關(guān)您可以打開was,在管理控制臺(tái)里面設(shè)定，完了還有重啟一下機(jī)器），并設(shè)定了reload的時(shí)間，那么每個(gè)一個(gè)時(shí)間段，系統(tǒng)會(huì)自動(dòng)讀取主題與皮膚文件。換言之，只有我們把這個(gè)時(shí)間差設(shè)的足夠小，就能立刻觀察到我們的修改結(jié)果。（在這里要注意一種情況：就是既然是從default.jsp開始聚焦，那么，如果您修改了由default.jsp調(diào)用的別的文件比如說BeginPage.jsp，而單單沒有修改default.jsp的話，系統(tǒng)會(huì)默認(rèn)您沒有做任何修改，所以也就沒有任何改動(dòng)了）同時(shí)我也想聲明一點(diǎn)，這種做法帶來的系統(tǒng)開銷特別大，只可是用于開發(fā)環(huán)境，在生產(chǎn)環(huán)境中是萬萬不可的！

2、復(fù)制主題或皮膚法：如果您對(duì)某一主題做了部分修改，可以復(fù)制一下這個(gè)文件夾并換個(gè)名字，然后添加這個(gè)主題到系統(tǒng)并配置給相應(yīng)的頁(yè)面。第一次安裝的新主題，當(dāng)然后重新編譯了。看得出來這種方法比較不方便，只適用于特殊情況。
我經(jīng)常使用的就是這兩種了，大家在開發(fā)中有什么好的注意，可以在這里交流。

七、Portal的皮膚開發(fā)簡(jiǎn)介
1、該改portlet的標(biāo)題背景圖片
     非常簡(jiǎn)單，請(qǐng)找到.war/skin/html下，發(fā)現(xiàn)系統(tǒng)已經(jīng)呆了好幾套皮膚，打開其中任意一個(gè)文件夾，您都能發(fā)現(xiàn)這個(gè)文件：
Control.jsp。這里面也是一個(gè)table。該table有兩行：第一行用來顯示portlet的標(biāo)題，后面是最大化、最小化、編輯按鈕；第二行是portlet的 body，用來顯示portlet的內(nèi)容。要換掉portlet標(biāo)題的背景圖片其實(shí)非常簡(jiǎn)單：在第一個(gè)<td>里面加上這么一句代碼：
    <td width="100%" height="21" border="0" cellpadding="0" cellspacing="0" background='<wps:urlFindInSkin file="wave.jpg"/>'>
    一切OK！
2、隱藏掉“最大化”、“最小化”、“還原”等圖標(biāo)。
<wps:portletMinimize>
<a href='<%=wpsPortletMinimizeURL%>'></a>
    </wps:portletMinimize>
       這段代碼是用來顯示“最小化”按鈕，不用說，直接去掉就行了！同理，您可以對(duì)此做任何編輯。
3、高級(jí)：加入個(gè)性化的左側(cè)管理菜單
在skin目錄下看到這個(gè)文件了嗎？LayeredContainer.jsp不錯(cuò)，就是它，它是一個(gè)表格：
<table border="0" cellpadding="0" cellspacing="0" width="778" height="100%">
該表格左側(cè)就是三級(jí)菜單（您如果再Default.jsp中部調(diào)用PageBar的話，這就是二級(jí)菜單了）。右邊呢，則是整個(gè)Portal系統(tǒng)得Body部分，顯示了所有的portlet。不曉得IBM為什么要這樣安排，似乎有點(diǎn)不合理。不過，趨勢(shì)是在這里修改的，可能是把它看作一個(gè)容器了吧！在左側(cè)的表格部分，您可以向編輯普通的網(wǎng)頁(yè)一樣，只要您稍微有些美工知識(shí)，就可以隨心所欲的制作出個(gè)性化的管理菜單了。
4、高級(jí)：與CSS結(jié)合，開發(fā)出漂亮的效果。

看上面的效果，是不是非常漂亮？其實(shí)這很簡(jiǎn)單，看LayeredContainer.jsp這個(gè)文件，下面是他的表格，稍微加一些CSS，就能實(shí)現(xiàn)這種效果了。如：
<table border="2" bordercolor="#ffffff" cellpadding="0" cellspacing="0" <%=tableHeight%> width="100%" >。
當(dāng)然，這需要素質(zhì)比較高的美工配合，也需要工程師在長(zhǎng)期的開發(fā)中仔細(xì)琢磨。再次祝您在Portal開發(fā)中信手拈來、出神入化！

參考資料：
1、 Sukumar Konduru 顧問軟件工程師達(dá)拉斯，IBM Developer Technical Support Center 先生的論文：了解 WebSphere 門戶網(wǎng)站如何顯示門戶頁(yè)面 — 第 I 部分：描述 Default.jsp、Head.jsp 和 ToolBarInclude.jsp
        2、IBM系列紅皮書。

致謝：
作者在開發(fā)及寫作中得到了趙建業(yè)先生的大力幫助，IBM公司李女士、王女士，曹先生、丁先生、陳先生、胡先生的大力幫助，在此一并鳴謝。

作者簡(jiǎn)介：鄭文平，北京東華合創(chuàng)數(shù)碼科技公司軟件工程師，Portal信息化專員，長(zhǎng)期從事Portal（尤其是IBM Websphere Portal）開發(fā)，曾參與并引領(lǐng)了北京馳普企業(yè)門戶、山東新汶礦務(wù)局遠(yuǎn)程調(diào)度系統(tǒng)、中國(guó)石化齊魯公司綜合數(shù)據(jù)平臺(tái)、北京供電局等多個(gè)Portal項(xiàng)目的開發(fā)。

posted on 2006-02-23 15:37 靜夜思閱讀(1499) 評(píng)論(1) 編輯收藏所屬分類: server

評(píng)論

# Unikal'Nyi Kontent 2009-05-18 08:06 Unikal'Nyi Kontent

Give please. Sometime they'll give a war and nobody will come.
I am from Panama and also now'm speaking English, give true I wrote the following sentence: "Offers search engine optimisation seo internet marketing, website development, website design and search engine optimization australia by mitash online.Seo companies must provide testimonials and client ranking results in order for."

Thanks for the help ;-), Nona. 回復(fù) 更多評(píng)論

新用戶注冊(cè) 刷新評(píng)論列表


只有注冊(cè)用戶登錄后才能發(fā)表評(píng)論。




網(wǎng)站導(dǎo)航: 博客園 IT新聞 Chat2DB C++博客博問管理
相關(guān)文章: Jetty 源碼分析 IBM Websphere Portal 主題與皮膚開發(fā) Tomcat配置技巧Top 10 Tomcat中文手冊(cè) tomcat安全驗(yàn)證

cmd