毛里求斯的化石博物館

Liferay Portal為我們提供了非常靈活的主題風(fēng)格定制功能，自身帶了四種風(fēng)格的theme，在官方網(wǎng)站上提供了很多風(fēng)格theme的下載，這無(wú)疑大大增強(qiáng)了主題風(fēng)格定制的功能。但是，我們完全可以開(kāi)發(fā)具有自己風(fēng)格的theme，這里，我們將討論怎樣來(lái)開(kāi)發(fā)個(gè)性的theme。

第一步：我們將以現(xiàn)有風(fēng)格classic為模板文件創(chuàng)建新的theme，我們將新theme命名為coldtear
1、將liferay/html/themes目錄下的classic文件夾copy一份副本，并修改副本的文件夾名為coldtea
2、在liferay/web-inf目錄下新建liferay-look-and-feel-ext.xml文件，文件liferay-look-and-feel.xml是定義主題風(fēng)格theme的配置文件，為了加以區(qū)分，我們?cè)谶@里新建了該文件的擴(kuò)展文件liferay-look-and-feel-ext.xml，該文件內(nèi)容如下：
這里，注意的是修改theme的id和name，以及root-path、templates-path和images-path的路徑，這樣，我們就可以在主題風(fēng)格頁(yè)面看到我們新的theme了。

第二步、分析classic的主題布局的劃分
1、打開(kāi)liferay/html/theme/coldtear/templates目錄，該目錄下存放著很多jsp文件，打開(kāi)portal_normal.jsp文件可以看到，該文件是整個(gè)頁(yè)面的主體，通過(guò)<liferay-util:include />標(biāo)簽和<%@ include>方法包含了很多jsp文件，其中top.jsp文件定義了頭部信息，navigation.jsp定義了導(dǎo)航菜單，bottom.jsp定義了底部語(yǔ)言標(biāo)簽信息，而頁(yè)面的主體信息是由<liferay-theme:box />標(biāo)簽定義的，top="portlet_top.jsp"定義了portlet的標(biāo)題欄信息，bottom="portlet_bottom.jsp"定義了portlet下面的陰影線，portlet的內(nèi)容則是由<liferay-util:include page="<%= Constants.TEXT_HTML_DIR + tilesContent %>" />定義的。所有的css樣式信息是定義在css_cached.jsp文件中的。
2、liferay portal的頁(yè)面定義大部分地方都采用了DIV＋CSS的方式，下面將以classic的整個(gè)DIV定義框架給出，以說(shuō)明classic風(fēng)格的定義方法。
這里我們可以看到classic的整體DIV定義框架，注釋部分對(duì)每個(gè)部分的定義都做了區(qū)分。

第三步、根據(jù)這樣一個(gè)結(jié)構(gòu)，我們可以設(shè)計(jì)自定義theme風(fēng)格的結(jié)構(gòu)，然后將各個(gè)區(qū)域細(xì)化到各個(gè)jsp文件中，并配以特定的圖片和樣式就可以實(shí)現(xiàn)自定義theme，為了達(dá)到更好的顯示效果，需要教好的掌握CSS的各個(gè)屬性和使用方法。