The Liferay Theme Generator lets you create themes, themelets, layout templates and more. It is just one of Liferay JS Theme Toolkit’s tools. There are a few dependencies required to run the generator. If you have NodeJS installed, you’re already one step ahead.
Follow these steps to install the Liferay Theme Generator and generate a theme:
-
Install Node.js. We recommend installing v8.10.0, which is the version Liferay Portal 7.1 supports. Note that Node Package Manager (npm) is installed with this as well. You’ll use npm to install the remaining dependencies and generator. Make sure to set up your npm environment before moving to the next step. Failing to do this can lead to permissions issues later on.
-
Use npm to install Yeoman and gulp:
npm install -g yo -
Install the Liferay Theme Generator. A few versions of the Liferay Theme Generator are available. The version you must install depends on the version of Liferay DXP you’re developing on. The required versions are listed in the table below:
Liferay Version Liferay Theme Generator Version Command 6.2 7.x.x npm install -g generator-liferay-theme@^7.x.x7.0 7.x.x or 8.x.x Same as above or below 7.1 8.x.x npm install -g generator-liferay-theme@^8.x.xIf you’re on Windows, follow the instructions in step 4 to install Sass, otherwise you can skip to step 5.
-
The generator uses node-sass. If you are on Windows, you must also install node-gyp and Python.
-
Run the generator and follow the prompts to create your theme:
yo liferay-themeFigure 1: You can generate a theme by answering just a few configuration questions.
-
Navigate to your theme folder and run
gulp deployto deploy your new theme to the server.
Now you have a powerful theme development tool at your disposal. The sky is the limit!
Figure 2: The tools are in your hands to create any theme you can imagine.