3.4.2. Stylesheets loading priority


You are looking at documentation for an older release. Not what you want? See the current release documentation.

When a portal page is loaded, the CSS stylesheets are loaded in the following order:

  1. Stylesheets of the Portal skin

  2. ECMS site stylesheets (see here for more details)

  3. Stylesheets of the portlets contained in the page

  4. Stylesheets of the Portal skin elements with a module name starting with customModule (see here for more details)

A style of a stylesheet can override the style of all the stylesheets loaded before. Therefore if a portlet body skin defines the following CSS class:

			my-portlet-style-class {
			    background-color: green;

It can be customized by adding the following class in a custom module of the portal skin:

			my-portlet-style-class {
			    background-color: red;
			    font-size: 1.2em;

This new style definition changes the background color to red and defines the font size to 1.2em.


Inside each category, stylesheets are loaded following an order defined by the attribute css-priority for Portal and Portlet skin elements and the field Priority for ECMS site stylesheets. The stylesheets with lower priority value are loaded first.

Copyright ©. All rights reserved. eXo Platform SAS
blog comments powered byDisqus