Creating Themes for Liferay 7.3

Building Theme for Liferay 7.3

Overview

This article describes how to create, build and deploy a theme for Liferay 7.3

Prerequisites

You should have Liferay 7.3 (with Liferay workspace) and Node (v10.x+) installed already

Theme Creation

Navigate to [project_root]/themes folder in terminal ([project_root] - root folder of your Liferay workspace project).
Install generator-liferay-theme globally:
npm i -g generator-liferay-theme
Install Yeoman (https://yeoman.io/) globally:
npm i -g yo
Create the liferay theme with yo liferay-theme command:
Answer required questions: define theme name and ID, choose deployment strategy (Local App Server), Liferay version (7.3) and site url (http://localhost:8080)

Theme Build and Deployment

Navigate to created theme folder:
cd demo-liferay-theme
Install Gulp (https://gulpjs.com/) with npm:
npm install gulp
Run npm audit fix, if you have appropriate warning message.
Build theme with gulp:
gulp build
Deploy theme with gulp:
gulp deploy
Assembled theme WAR should be deployed to deployPath directory specified in liferay-theme.json file.

Comments

Post a Comment

Popular posts from this blog

Liferay Search Container Example

Or how to implement a custom search container in Liferay Overview   Search Containers are used in Liferay to display the table data. This article shows a simple example of how to implement a custom search container.  Example < liferay-portlet :renderURL varImpl ="iteratorURL" /> < liferay-ui :search-container total =" <%= ProjectLocalServiceUtil. getProjectsCount (scopeGroupId) %> "                              delta ="10"                              emptyResultsMessage ="no-projects-found"                              iteratorURL =" <%= iteratorURL %> " >     < liferay-ui :search-container-results             results =" <%= ProjectLocalServiceUtil. getProjects (scopeGroupId, searchContainer.getStart(), searchContainer.getEnd()) %> " />     < liferay-ui :search-container-row className ="com.sample.sb.model.Project" modelVar ="project" keyP
Read more

Liferay DXP - max upload file size

Image
Liferay DXP - increase Maximum Upload Request Size By default, Liferay has limit to 100 MB for file upload. Sometimes you need to upload larger files, and this restriction can be changed in configuration. Go to Control Panel -> Configuration -> System Settings -> Infrastructure. Click on "Upload Servlet Request". Modify " Overall Maximum Upload Request Size"  value and set which you need: Save the configuration. Now you should be able to upload large files to your Liferay DXP instance.
Read more

Liferay Keycloak integration

Image
Liferay Keycloak integration using OpenID Overview This tutorial explains how to configure OpenID SSO between Liferay 7.2 and Keycloak 7.0.1 Installation instructions KeyCloak Configuration 1. Install and startup Keycloak server Download latest Keycloak server:  https://www.keycloak.org/downloads.html Unzip keycloak-7.0.1.zip folder. Run  keycloak-7.0.1/bin/standalone.sh  (or  keycloak-7.0.1/bin/standalone.bat ) file. Keycloak should be started on 8080 port:  http://localhost:8080 2. Create default admin user: and sign in to Admin Console. 3. Check OpenID configuration Click on "OpenID Endpoint Configuration": JSON configuration should appear, like this: { "issuer": "http://localhost:8080/auth/realms/master", "authorization_endpoint": "http://localhost:8080/auth/realms/master/protocol/openid-connect/auth", "token_endpoint": "http://localhost:8080/auth/realms/master/protocol/openid-con
Read more