Page History

...

<module-name>
├── apps/
├── dialogs/
│   └── myDialog.yaml
├── i18n/
├── resources/
└── templates/
     ├── components/
     └── pages/
         └── my-template/
             ├── myTemplate.yaml
             └── myTemplate.ftl
├── themes/

You can use Magnolia CLI to quickly create all the folders and files in the right location.

Advanced topics:

• Modules in depth
• Module structure
• Module descriptor

Templating in Magnolia

Templates are blueprints for creating pages, areas and components. For example, when you create a page in the Pages app, you must select a template for the page to be based on. The content that editors provide using dialogs is merged into the template.

...

• A template definition - to give the template a name and make it available to the system. The template definition specifies at least a script and a renderer. Magnolia includes a FreeMarker renderer that is used by default if no other is specified.
• A template script - to define the output, typically HTML. 
• Optionally, a dialog definition - to define a dialog for content entry.
• Optionally, a model - the model can be a JavaBean implementing complex logic or a JavaScript model.

...

In Magnolia light development, you configure definitions in YAML files and scripts in a templating language such as FreeMarker or JSP.

...

The page template definition contains an areas section which lists the areas on the page. For each area, you specify the components that will be available in a simple list.

More information: 

• Page definitions 

Component templates

A component is the smallest block of content that editors can edit, delete, copy and move as a single unit on the page. At its simplest, a component may be just text. However, a component can contain anything: a related image, a teaser to another page, or a social media feed from a third party web service.

...

Components render content entered by editors in dialogs.

More information: Component definitions

Template scripts

A template script defines the output, typically HTML, and is interpreted by a  

...

• Static markup (HTML).

• Dynamically assigned values provided by Templating functions and other convenience helpers.

• Content references.

More information: Template scripts

Dialogs

Dialogs enable editors to enter content. Editors type content into fields and the dialog saves the content entered in the repository.

The functionality of each input field in a dialog is provided by a field definition class that allows the editor to perform a task such as enter text, upload an image, select a date etc. Template definitions reference dialog definitions - this is how Magnolia knows which dialog to associate with the template. 

Pages, area and component templates can all use dialogs. In fact, all dialogs used throughout Magnolia are configured in the same way. For example, the configuration of dialogs used in apps and components is the same.

More information: Dialog definitions

Resources

In Magnolia, the term resource is used for all the files in a light module, such as:

...

<link rel="stylesheet" href="${ctx.contextPath}/.resources/my-module/css/style.css">

More information:

• resfn -  With resfn you can automatically include all web resources in your module.
• Themes - With themes you can specify a collection of web resources to be included.

...