需要更改Liferay中的模板樣式

Question

我想使用css更改liferay的外觀和感覺。我對liferay很陌生。任何人都可以給我任何想法來做這些改變。在此先感謝

Answer 1

我們已經爲不同的公司完成了許多LifeRay定製，但您的問題太模糊，我們無法回答。如果你只是想改變一些顏色和字體，那麼編輯CSS就沒問題，但如果你想徹底改變佈局，那麼你需要深入研究模板文件並開始使用XHTML。

提供更多的細節，我們也許能夠督促你在正確的方向：d

Answer 2

你可以讓你自定義樣式與Liferay的插件SDK，它可以在這裏找到：http://www.liferay.com/downloads/liferay-portal/additional-files

有包含主題文件夾，您可以在其中創建新主題。 Liferay在這裏生成一個基本主題作爲樣板，然後您可以自定義並部署到Liferay安裝。

Answer 3

的一步一步看似複雜，但它不是那麼糟糕.....

1A）下載並解壓插件SDK您要使用的Liferay版本。所有的下載都是SF頁面http://lportal.sourceforge.net/

1B），請確保您有螞蟻的最新版本，並符合您的Liferay版本（1.5.x版或1.6.x版）

2）存在的JDK版本上套件中的一些主要文件夾。更改爲「主題」文件夾並以此格式運行創建腳本（在Linux或Mac上，您需要使.sh文件可執行）

c：\ liferay \ plugins \ themes>創建我的名字「我的主題描述」 linux/mac $> ./ create.sh my-name「我的主題描述」

這將在名爲my-name-theme的文件夾中創建一個骨架主題，並在其中創建一個名爲_diff的文件夾。

在_diff文件夾中進行所需的任何修改。 （除了WEB-INF中屬性文件的更改）

一旦做出更改，在my-name-theme文件夾中運行「ant compile」，sdk將通過它的步調運行並吐出一個.war文件添加到sdk根目錄下的「dist」文件夾中。您可以使用插件安裝程序

或...如果您將sdk配置爲知道您的開發服務器的位置，您可以從主題文件夾運行「ant deploy」並讓liferay中的自動部署魔法執行工作。

安裝主題後，只需使用「管理頁面」工具中的「外觀」選項卡進行分配即可。

提示：對custom.css文件進行大部分更改....使事情變得容易升級。

提示：如果您爲每次更改都執行此操作，開發對於CSS來說確實很慢....因此，如果您正在運行開發服務器，請在head標記結束之前添加一個樣式標記，指向您的_diffs/css文件夾。 HREF = 「文件：///...../_diffs/custom.css」。通過這種方式，無論您進行的任何編輯都會被編譯到下一個版本的戰爭中，並且會覆蓋當前安裝的版本而不會重新上傳。請務必在將其放入實時服務器之前刪除該鏈接。

liferay.com文檔很好，有一個「themer's guide」我找不到現在的鏈接，讓我開始。

Answer 4

可以

mvn archetype:generate 

然後選擇「Liferay的主題 - 原型（提供一個原型創建Liferay的主題。）」等瞧你準備好塗自定義主題。

最佳做法建議您僅使用custom.css文件製作所有自定義主題，並且除非絕對必要，否則不覆蓋任何模板。這將使未來的升級變得更容易，因爲您不必手動修改模板以添加對新Liferay功能的支持。

部署使用

mvn clean package liferay:deploy

Answer 5

IMO主題開發的新創建的主題Liferay的可以下手相當緩慢。我發現兩種不同的方法非常有用。它適用於我，也可以爲你工作。

1. 如果您AFAIK，你必須每 兩個時間看到的變化，這對於 前端開發人員很令人沮喪部署編輯_diff文件夾內的文件。可以在tomcat/themename文件夾中直接編輯css文件 。將更改後的每幾小時 複製到_diff文件夾中並進行部署。在我的情況下，CSS保持在 C：\ liferay-portal-6.1.0 \ tomcat-7.0.23 \ webapps \\ css \
2. 此外，如果您知道liferay支持Sass。所以你在寫Sass「部署」可能是你最有可能的選擇。但我也想出了一個加速這個過程的方法。安裝ruby（如果您使用的是Windows，請在Mac中預安裝）>安裝Compass>並創建一個空白指南針項目。開始「指南針觀察」。在您的IDE中打開scss文件和編譯後的css文件。 「指南針觀察」將輪詢您scss文件中的更改並將編譯後的輸出放入css文件中。每一次，你都可以將CSS輸出複製到主題文件夾中的css文件中，或直接在chrome/safari中的firebug或web-inspector中複製。

我發現這些是比每次部署或完全開發firebug/web-inspector更快的開發實踐。

此外，如果有人知道更好的方法，特別是只有CSS/JS部署（或簡單的副本，如果一個人不寫Scss），請告訴我們。