1. Create MVC portlet :

1. Go to Liferay workspace project → modules → new.
2. Select other → Liferay → Liferay Module Project and click on “Next”.
3. Enter the project name.
4. Select “Project Template Name” as “mvc-portlet” and click on “Next”.
5. Enter a Package name and click on “Finish”. The necessary file structure for the MVC module will get created as below.

Replace the property with this code in your portlet class

  	package com.themeray.student.portlet;
	import com.liferay.portal.kernel.portlet.bridges.mvc.MVCPortlet;
    import com.themeray.student.constants.StudentPortletKeys;

    import javax.portlet.Portlet;

    import org.osgi.service.component.annotations.Component;
    @Component(
        immediate = true,
        property = {
            "com.liferay.portlet.display-category=category.hidden",
            "com.liferay.portlet.instanceable=true",
            "javax.portlet.display-name=Student Portlet",
            "javax.portlet.init-param.template-path=/",
            "javax.portlet.init-param.view-template=/view.jsp",
            "javax.portlet.name=" + StudentPortletKeys.STUDENT,
            "javax.portlet.resource-bundle=content.Language",
            "javax.portlet.security-role-ref=power-user,user",
        },
        service = Portlet.class
    )
    public class StudentPortlet extends MVCPortlet {

    }
  

2. Implement your constants class :

Add below code in your constants class.

    package com.themeray.student.constants;
    public class StudentPortletKeys {

        public static final String STUDENT =
            "com_themeray_student_StudentPortlet";

    }
    

3. Add Dependency : 

Add below line in "build.gradle" file

  compileOnly group: "com.liferay",name:"com.liferay.application.list.api"
  

4. Create your panel app component class

This class must extend the BasePanelApp Class and declare it as a service using service = PanelApp.class.

Add new class named StudentPanelApp

package com.themeray.student.portlet;

import com.liferay.application.list.BasePanelApp;
import com.liferay.application.list.PanelApp;
import com.liferay.application.list.constants.PanelCategoryKeys;
import com.liferay.portal.kernel.model.Portlet;
import com.themeray.student.constants.StudentPortletKeys;
import org.osgi.service.component.annotations.Component;
import org.osgi.service.component.annotations.Reference;

@Component(
	    immediate = true,
	    property = {
	        "panel.app.order:Integer=0",
	        "panel.category.key=" + PanelCategoryKeys.CONTROL_PANEL_USERS
	    },
	 
	    service = PanelApp.class)
	 
public class StudentPanelApp extends BasePanelApp {
 
    @Override
    public String getPortletId() {
        return StudentPortletKeys.STUDENT;
    }
 
    @Override
    @Reference(target = "(javax.portlet.name=" + StudentPortletKeys.STUDENT + ")", unbind = "-")
    public void setPortlet(Portlet portlet) {
        super.setPortlet(portlet);
    }
}

Lets understand following

“panel.category.key” defines the category which is “control_panel.users” in our case. So our Student portlet will be added under “Users” section in control panel.

“panel.app.order” defines the portlet position in the portlet list under “Users” section in control panel.

5. Deploy your module : 

 

 

To apply configurations into a 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

• JDK
• Eclipse
• MySQL

1. Create a module project:

Create new Liferay 7.2 Module with name ColorPreferences and package name com.themeray.colorpreferences

Structure of the project : 

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 deflt 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.

Change the configuration and save it.

When close the configuration interface the color is changed