Properties page is a page showing the properties of a resource.

It also supports resource filtering using FilteringResourceWrapper and acts as its container.

It has the following content structure:


A general purpose ID to uniquely identify the console.

The recommended value is hierarchical separated by “-“. e.g. “cq-commerce-report”


The base title of the page.

e.g. “AEM Sites”


The URL to navigate to when closing this page, e.g., when the user presses “Close”.


The id of the form component.

The intention of propertiespage is to standardize the property screen, including the behaviour of form success handler whether the page is reloaded or redirected or otherwise. Thus, it is RECOMMENDED that the form is a foundation-form without any success handler configured. propertiespage will manage the form success handler behaviour internally.

  1. true

When formId is specified, true to indicate if a simple “Save” button is rendered, false to render a more complex form actions (currently “Save & Close” and “Save”).

Note that this flag is only temporary for compatibility, since the intention is to standardize the UX as the behaviour when the value is false.


To redirect the page, this resource can be specified. It will be included, where the redirect can be performed.


A folder to specify the content of <head> of the page. Its child resources are iterated and included as is.


The component to render the title.

This is optional, and if not specified, the value of jcr:title is used. If the title is just a simple string, Title can be used.

The only requirement of the component is to generate a simple text without any wrapping markup. E.g. To have a title of “My Page”, just make the component do something like out.print("My Page").


The header area just above the properties view. Any component can be used here.


The render condition component to check if the form is editable by the current session.

By default the form is assumed to be editable, even though the form submission may fail and handled accordingly.


The component to render the properties view (the content area).


The footer area just below the properties view. Any component can be used here.


The folder for the actions applicable in the context of the properties page.

The action can be any action component such as Button, AnchorButton, Pulldown,

The actionBar variant of the components above SHOULD be used, unless primary variant is used.


A folder to specify the panels of the rail.

Its child resources are considered as the panels, where each MUST be a RailPanel (or its derivative).

By default the rail is closed. To make it always open, alwaysActive boolean property can be specified. One of the railpanel then must be configured to be active.


+ mypage
  - sling:resourceType = "granite/ui/components/shell/propertiespage"
  - jcr:title = "My Properties"
  - formId = "myFormId"
  - backHref = '${empty header.Referer ? granite:concat("/mycollection.html", granite:encodeURIPath(granite:relativeParent(param.item, 1))) : header.Referer}'
  + content
    - sling:resourceType = "granite/ui/components/coral/foundation/form"
    - granite:id = "myFormId"
  + rails
    - alwaysActive = true
    + panel1
      - sling:resourceType = "granite/ui/components/coral/foundation/panel/railpanel"
      - jcr:title = "Panel 1"
      - active = true
    + panel2
      - sling:resourceType = "granite/ui/components/coral/foundation/panel/railpanel"
      - jcr:title = "Panel 2"