
Change Liferay Default Theme
This page needs updating.. For more information, see Wiki - Need Updating.
Introduction #
Whenever a new community website (layout set) or a user homepage is created a default theme is applied. Liferay comes configured to use one of its themes, 'classic', as the default. But you can change this behaviour and set the default theme to one of your own.
This article also explains how to configure Liferay to prevent users to change the theme to other different than the default.
WARNING #
If you do change the theme in the portal.properties or in the portal.ext.properties, and then forget to deploy the theme, you won't be able to log in to Liferay.
Quick and Easy #
- Open the liferay-look-and-feel.xml that contains the theme you want as your default.###
- Find the theme id. Example: <theme id="mynewtheme" name="New Theme"> The theme id is mynewtheme.
- Open portal-ext.properties or create it if it does not exist and put it next to portal.properties. If you are using the ext development environment edit \ext-ejb\classes\portal-ext.properties###
- Paste this line of code into the file: default.theme.id=
- Place the theme id after the above code. Example: default.theme.id=mynewtheme
Note: As of 6.x, you cannot just use the theme id specified in the liferay-look-and-feel.xml. Instead, go to Control Panel->Plugins Configuration->Click on theme of interest->note the Plugin ID and use that
In Depth Look #
A default theme comes into play when you create a new community. There are 3 files you need to know about when it comes to setting the default theme for Liferay:
- portal.properties
- liferay-look-and-feel.xml
- portal-ext.properties
portal.properties #
:Locate "Look and Feel" in ..\portal-ejb\classes\portal.properties :Take notice of this line: default.theme.id=classic :By default, the classic theme is used as the default theme.
## ## Look and Feel ## # # Set the following to false if the system does not use allow users to # modify the look and feel. # look.and.feel.modifiable=true # # Set the default theme id. # default.theme.id=classic # # Set the default color scheme id. # default.color.scheme.id=01
portal.properties [4.3.X+] #
:Locate "Look and Feel" in ..\portal-impl\classes\portal.properties :Take notice of this line: default.regular.theme.id=classic :By default, the classic theme is used as the default theme.
## ## Look and Feel ## # # Set the following to false if the system does not use allow users to # modify the look and feel. # look.and.feel.modifiable=true # # Set the default theme id for regular themes. # default.regular.theme.id=classic # # Set the default color scheme id for regular themes. # default.regular.color.scheme.id=01 # # Set the default theme id for wap themes. # default.wap.theme.id=mobile # # Set the default color scheme id for wap themes. # default.wap.color.scheme.id=01 # # Set the following to true if you want a change in the theme selection of # the public or private group to automatically be applied to the other (i.e. # if public and private group themes should always be the same). # theme.sync.on.group=false
liferay-look-and-feel.xml #
:All themes used in Liferay it will have a liferay-look-and-feel.xml that defines it. :Locate the liferay-look-and-feel.xml file that corresponds to the theme you want to be default. :Look for a line that looks similar to: <theme id="aqua" name="Aqua">. Notice this particular theme id is called aqua. Note: In version 5.0.1 there is another property to change:<root-path>/html/themes/classic</root-path>. The value of this property should be the location of the default theme, you should change it accordingly. For example:<root-path>/html/themes/myTheme</root-path>.
portal-ext.properties #
:Instead of editing portal.properties directly it's best practice edit/copy the necessary code you want to overwrite into portal-ext.properties file in \ext-ejb\classes\portal-ext.properties. :Copy default.theme.id=classic (portal.properties) to your portal-ext.properties file and edit it to point to the theme id of the theme you want to set as your default. :Please note that in Liferay 4.3 you will need to copy a slightly different code into your portal.ext.properties file: default.regular.theme.id=classic.
Congratulations, you've just changed the Liferay default theme!