Magnolia 5.7 reached extended end of life on May 31, 2022. Support for this branch is limited, see End-of-life policy. Please note that to cover the extra maintenance effort, this EEoL period is a paid extension in the life of the branch. Customers who opt for the extended maintenance will need a new license key to run future versions of Magnolia 5.7. If you have any questions or to subscribe to the extended maintenance, please get in touch with your local contact at Magnolia.
This page explains how to use the Magnolia Templating Kit (MTK), provided as a submodule of the Magnolia Templating Essentials module (MTE) .
MTE and MTK
Magnolia Templating Essentials (MTE) provides useful templating functionality for all projects in the form of templating function libraries, definitions, imaging support and templates via the MTK submodule. MTE is front-end framework agnostic, which means you can use it with any modern CSS and JS framework.
In addition to the standard maven module, the MTK is also available as a light module for easy access to the files. To get the latest version, see the download area on the release notes pages.
To experiment with MTK or Magnolia templating, put the unzipped MTK light module in Magnolia's resource directory, and make changes to the files. Due to Magnolia's resource loading mechanism, these files will be used instead of the ones in the Java classpath provided by the Maven module.
MTK template definitions
basic page template is a good starting point for custom page templates.
The basic template contains:
- Page definition, page template script and a page properties dialog that allows you to set titles and metadata.
- Components that are available in main and footer areas. See the page definition for component availability.
- Navigation scripts.
The areas are defined in the page template (see the
areas node below). Areas typically define what components editors can place inside the area (see the
availableComponents node in
main areas below).
The MTK provides basic components for use in your templates:
Text and image
Displays text and an image.
Creates a link to an internal or external page or a downloadable asset.
Organizes link components into a bulleted, inline or ordered list.
Displays an image.
Promotes another Magnolia page, third-party website or a downloadable asset, inviting the visitor to click for more.
Allows editors to enter HTML markup and renders it on the page.
Adds the possibility to add a video. Videos can be taken from the assets app - or you may just add "embed code" as provided by youtube and other public video repositories.
A component to render the page properties
The MTK provides basic navigation to use in your templates. Add subpages to see the navigation.
navigation area is rendered by the
navigation.ftl script. This script sets the root page, navigation depth and behavior, and includes the
The macro does the "heavy-lifting" and generates a simple navigation which you can use as a starting point.
- Moyan Breen: Sunset Aurora photo. Creative Commons Attribution 2.0 Generic (CC BY 2.0)
- Andrew Wilkinson : Forest Stream photo. Creative Commons Attribution 2.0 Generic (CC BY 2.0)
- Booked.net: Weather widget code