To apply configurations into portlets in Liferay, we can implement the portlet preference. In this example, we have integrated a color configuration into a portlet in Liferay 7.2.
Prerequisites
- Java
- Liferay portal 7/7.x
Environment Requirement
1. Create a module project:

Structure of the project: Create a new Liferay 7.2 Module with the name ColorPreferences and package name com.themeray.colorpreferences

Update the content of the build.gradle:
dependencies {
compileOnly group: "com.liferay", name: "com.liferay.asset.taglib"
compileOnly group: "com.liferay", name: "com.liferay.comment.taglib"
compileOnly group: "com.liferay", name: "com.liferay.frontend.taglib"
compileOnly group: "com.liferay", name: "com.liferay.frontend.taglib.dynamic.section"
compileOnly group: "com.liferay", name: "com.liferay.frontend.taglib.form.navigator"
compileOnly group: "com.liferay", name: "com.liferay.frontend.taglib.util"
compileOnly group: "com.liferay", name: "com.liferay.journal.taglib"
compileOnly group: "com.liferay", name: "com.liferay.layout.taglib"
compileOnly group: "com.liferay", name: "com.liferay.site.taglib"
compileOnly group: "org.osgi", name: "org.osgi.service.component.annotations"
cssBuilder group: "com.liferay", name: "com.liferay.css.builder", version: "3.0.2"
compileOnly group: "com.liferay.portal", name: "com.liferay.portal.kernel", version: "2.0.0"
compileOnly group: "com.liferay.portal", name: "com.liferay.util.taglib", version: "2.0.0"
compileOnly group: "javax.portlet", name: "portlet-api", version: "2.0"
compileOnly group: "javax.servlet", name: "javax.servlet-api", version: "3.0.1"
compileOnly group: "jstl", name: "jstl", version: "1.2"
compileOnly group: "org.osgi", name: "osgi.cmpn", version: "6.0.0"
compileOnly group: "com.liferay", name: "com.liferay.portal.configuration.metatype", version: "2.0.6"
compile group: "biz.aQute.bnd", name: "biz.aQute.bndlib", version: "3.1.0"
}
2. Create a Java interface :
Create java class ColorConfiguration.java and add the code below :
import aQute.bnd.annotation.metatype.Meta;
@Meta.OCD(id = ColorPreferencesPortletKeys.CONFIGURATION_ID)
public interface ColorConfigurations {
@Meta.AD(deflt = "white",
name = "color",
optionLabels = { "%White", "%Red", "%Yellow" },
optionValues = { "white", "red", "yellow" },
required = false
)
public String color();
}
@Meta.OCD is used to register this class as a configuration with a specific id. The ID must be the fully qualified configuration class name.
@Meta.AD specifies the default value of a configuration field as well as whether it’s required or not. Note that if you set a field as required and don’t specify a default value, the system administrator must specify a value in order for your application to work properly. Use the property to specify a default value.
3. Create an action class :
Configuration action class is required to access portlet preferences. This class must extend the DefaultConfigurationAction class. It is responsible for storing portlet configurations.
package com.themeray.colorpreferences.action;
import com.liferay.portal.kernel.portlet.ConfigurationAction;
import com.liferay.portal.kernel.portlet.DefaultConfigurationAction;
import com.liferay.portal.kernel.util.ParamUtil;
import com.themeray.colorpreferences.constants.ColorPreferencesPortletKeys;
import com.themeray.colorpreferences.interfaces.ColorConfigurations;
import java.util.Map;
import javax.portlet.ActionRequest;
import javax.portlet.ActionResponse;
import javax.portlet.PortletConfig;
import org.osgi.service.component.annotations.ConfigurationPolicy;
import org.osgi.service.component.annotations.Activate;
import org.osgi.service.component.annotations.Component;
import org.osgi.service.component.annotations.Modified;
import aQute.bnd.annotation.metatype.Configurable;
@Component(
configurationPid = ColorPreferencePortletKeys.CONFIGURATION_ID,
configurationPolicy = ConfigurationPolicy.OPTIONAL,
immediate = true,
property = "javax.portlet.name=" + ColorPreferencePortletKeys.COLORPREFERENCES,
service = ConfigurationAction.class
)
public class ColorPreferencesAction extends DefaultConfigurationAction {
private volatile ColorConfiguration colorConfiguration;
@Override
public void processAction(PortletConfig portletConfig, ActionRequest actionRequest, ActionResponse actionResponse)
throws Exception {
String color = ParamUtil.getString(actionRequest, "color");
setPreference(actionRequest, "color", color);
super.processAction(portletConfig, actionRequest, actionResponse);
}
@Activate
@Modified
protected void activate(Map<object object=""> properties) {
colorConfiguration = Configurable.createConfigurable(ColorConfiguration.class, properties);
}
}
4. Implement your portlet class :
Add this code to your ColorPreferencesPortlet.java Class :
package com.themeray.colorpreferences.portlet;
import com.liferay.portal.configuration.metatype.bnd.util.ConfigurableUtil;
import com.liferay.portal.kernel.portlet.bridges.mvc.MVCPortlet;
import com.themeray.colorpreferences.constants.ColorPreferencesPortletKeys;
import com.themeray.colorpreferences.interfaces.ColorConfigurations;
import java.io.IOException;
import java.util.Map;
import javax.portlet.Portlet;
import javax.portlet.PortletException;
import javax.portlet.RenderRequest;
import javax.portlet.RenderResponse;
import org.osgi.service.component.annotations.Activate;
import org.osgi.service.component.annotations.Component;
import org.osgi.service.component.annotations.Modified;
@Component(
…
)
public class ColorPreferencesPortlet extends MVCPortlet {
private volatile ColorConfiguration colorConfiguration;
@Override
public void render(RenderRequest renderRequest, RenderResponse renderResponse)
throws IOException, PortletException {
renderRequest.setAttribute(ColorConfiguration.class.getName(), colorConfiguration);
super.render(renderRequest, renderResponse);
}
@Activate
@Modified
protected void activate(Map<String, Object> properties) {
colorConfiguration = ConfigurableUtil.createConfigurable(ColorConfiguration.class, properties);
}
}
5. Update your init.jsp :
Content of your init.jsp file :
<%@page import="com.themeray.colorpreferences.interfaces.ColorConfigurations"%>
<%@ page import="com.liferay.portal.kernel.util.GetterUtil" %>
<%@page import="com.liferay.portal.kernel.util.Validator"%>
<%@page import="com.liferay.portal.kernel.util.StringPool"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/portlet" prefix="portlet" %>
<%@ taglib uri="http://liferay.com/tld/aui" prefix="aui" %>
<%@taglib uri="http://liferay.com/tld/portlet" prefix="liferay-portlet" %>
<%@taglib uri="http://liferay.com/tld/theme" prefix="liferay-theme" %>
<%@taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui" %>
<liferay-theme:defineObjects />
<portlet:defineObjects />
<%
ColorConfiguration colorConfiguration = (ColorConfiguration) renderRequest
.getAttribute(ColorConfiguration.class.getName());
String color = StringPool.BLANK;
if (Validator.isNotNull(colorConfiguration)) {
color = portletPreferences.getValue("color", colorConfiguration.color());
}
%>
6. Create configuration.jsp:
The configuration.jsp file must contain a form to set all configurations for your portlet.
<%@page import="com.liferay.portal.kernel.util.Constants"%>
<%@ include file="/init.jsp" %>
<liferay-portlet:actionURL portletConfiguration="<%=true%>" var="configurationActionURL" />
<liferay-portlet:renderURL portletConfiguration="<%=true%>" var="configurationRenderURL" />
<aui:form action="<%=configurationActionURL%>" method="post" name="fm">
<aui:input name="<%=Constants.CMD%>" type="hidden" value="<%=Constants.UPDATE%>" />
<aui:input name="redirect" type="hidden" value="<%=configurationRenderURL%>" />
<aui:fieldset>
<aui:select label="Color" name="color" value="<%=color%>">
<aui:option value="white">White</aui:option>
<aui:option value="red">Red</aui:option>
<aui:option value="yellow">Yellow</aui:option>
</aui:select>
</aui:fieldset>
<aui:button-row>
<aui:button type="submit"></aui:button>
</aui:button-row>
</aui:form>
7. Update view.jsp:
Edit the view.jsp file to display the value of the configure color
<%@ include file="/init.jsp"%>
<p>
Favorite color: <span style="color: <%=color%>;"><%=color%></span>
</p>
Now you can deploy your module and add your portlet to a Liferay page.

Click on the ellipsis icon and select the option Configuration.

When close the configuration interface the color is changedChange the configuration and save it.
