eXo Platform 4.0 Documentation > Platform User Guide > Administering eXo Platform > Customizing the look and feel of eXo Platform

11.2.1. Creating a global stylesheet

  1. Click ContentSites Explorer on the top navigation bar.

  2. Select the Sites Management drive in the drives list.

  3. Select a site in the Sites Management panel, for example, acme, then select the css folder.

  4. Click to open the CSS File form which allows creating a new global stylesheet.

  5. Enter the name of global stylesheet into the Name field, for example, GlobalStylesheet_Orange.

  6. Set the value as "True" in the Active field to activate your global stylesheet for your site. "True" is set by default when a new global stylesheet is created. If you select "False", your newly created global style will be disabled.

  7. Input one positive integer into the Priority field, for example "10".

  8. Define your styles in the CSS Data field. Here, you can directly enter your CSS rules, or copy and paste them from your favorite text editor.

    For example, you can define your styles with the following information:

  9. Click Save or Save & Close to save your newly created global stylesheet. You will see your global stylesheet in the Sites Management panel.

Note

  • The values in both of the Active and Priority fields decide if your newly created global stylesheet is applied into your site successfully or not. If the Active field is set to "True" in many global stylesheets, the system will automatically merge all the global stylesheets into the ${site-name}/Default/Stylesheet-min-lt.css file of the css folder in the ascending order and get the stylesheet with the highest priority. Thus, after selecting "True", to make sure that your stylesheet is applied, you need to pay attention to the priority level so that the selected priority of your stylesheet is higher than those of other global stylesheets in the css folder.

  • The default global stylesheet will be automatically created in the css folder when you create a new site. However, this global stylesheet can be overwritten by either setting "False" for its Active field or setting the higher priority for other global stylesheet than that of the default global stylesheet.

  • When you want to create a common stylesheet to share for all sites in the portal, you should create one in the Sites Management/shared/css folder. This stylesheet will be rendered and applied into your desired site when you switch to it.

Editing a global stylesheet

Simply select your desired global stylesheet and click Edit on the action bar, or right-click the file and select Edit from the drop-down menu to open the CSS File form.

Renaming a global stylesheet

Simply right-click your desired global stylesheet in the Sites Management panel, then select Rename.

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