Page definition

Light developers can use the create-page command in the Magnolia CLI to create page templates.

Pages are based on page templates. A page definition knows which script should be used to render a page. It may also define areas. You can configure a template in a YAML file or a JCR node.

Page template properties

You can use common template properties and the following properties in a page definition:

example/templates/pages/home.yaml

renderType: freemarker
templateScript: /my-module/templates/pages/home.ftl
dialog: my-module:pages/homePageProperties
# areas:
visible: true
class: com.example.templates.CustomTemplateDefinition
modelClass: com.example.templates.HomePageModel

See an overview of differences between FreeMarker and headless templating.

Properties specific to page template definition:

Property Description

visible

optional, default is true

true makes the template available to editors.

When visible is set to false, the template is not available. However, the opposite is not always true. There are more ways to control page template availability.

type

optional, default is content

Assigns a type to the template. Types control template availability in the page hierarchy. For example type home is available at the site root level, section at level 2, and content at level 3. See Page template availability on how to use the type property.

This property is different from the type property in Area definition.

subtype

optional

Assigns a subtype to the template. You can use subtypes to aggregate content. For example, aggregate all content pages of subtype news into a teaser component. There are no default values and you can use arbitrary values to categorize your templates in any way you like.

autoPopulateFromRequest

optional, default is true

The population of request parameters is typically enabled globally in /server/rendering/engine. Add this property and set to false to override the global setting. See Populating the rendering model with request parameters for more.

areas

optional

Area definitions.

containerElements

optional

A list of HTML element names.

Green bars for editors are placed inside the elements listed. By default, this is done for the div element.

Configuring containerElements can be useful where custom HTML elements can have different names. In those cases, the property ensures that the green bars appear in the best location.

Example

renderType: freemarker
templateScript: /my-module/templates/pages/main.ftl
containerElements:
  - ui-cms-grid-element
  - other-element

Once set, the attribute applies to the whole page.

Location of page definitions

Put your page definitions here:

YAML file: $magnolia.resources.dir/<module-name>/templates/pages
JCR node: /modules/<module-name>/templates/pages

Page subtypes

The optional subtype property is useful for aggregating related page templates. For example, you could use this property to aggregate the latest news articles and then create a component that displays a list of excerpts that point to the news pages.

There are no default values and you can use arbitrary values to categorize your templates in any way you like.

Adding page areas

Page area definitions are added in the areas node of a page template.

How to configure area definitions is covered in Area definition.

This example configuration adds two areas to a page template.

<module name>/templates/pages/<page template name>.yaml

areas:
  area-1:
    # area-1 configuration
  area-2:
    #area-2 configuration

Page definition

Page template properties

Location of page definitions

Page subtypes

Adding page areas

Location

Main doc sections