CSS YAML Configuration Reference

You can define a CSS client extension with a client-extension.yaml file.

Usage Details

This client-extension.yaml file defines a CSS client extension definition:

able-global-css:
    name: Able Global CSS
    type: globalCSS
    url: global.css

The required url property defines the CSS resource file’s location. CSS included here is added to the styling already used in the theme. In case of a conflict, the client extension’s CSS overrides the styling already on the page.

The example workspace includes a complete CSS client extension.

YAML Properties

These properties are specific to CSS client extensions:

Name	Data Type	Description
url	URL	(Required) The path to the CSS file added to the page’s CSS when enabled on a page. The complete URI is prefixed by the baseURL value.

See Frontend Client Extension Properties for properties common to all frontend client extensions.

Related Topics

• Customizing Liferay’s Look and Feel
• Working with Client Extensions
• Theme CSS YAML Configuration Reference