Frontmatter, also known as page metadata, is a powerful feature that allows easy configuration of a page and Mosaic site components e.g. the sidebar.

Frontmatter is written in yaml syntax and is found at the top of a page between 2 sets of 3 dashes: ---.

With the syntax below it is possible to directly reference frontmatter inside content using curly brackets and the meta object.

You can think of meta as a JSON object that holds all the frontmatter of a page and when the Mosaic RefPlugin encounters the curly brackets then the value in the frontmatter will be resolved.

This is very common to see Mosaic pages that reference the title as shown below:

Mosaic plugins can also embed their output into page frontmatter in 2 different ways:

• a property is directly added to the page object
• a JSON file is generated and referenced using a ref

A plugin can add a property to a page simply by extending the page object it receives in the $afterSource lifecycle event:

You could use this property in the page content using {meta.newProperty}

Let's take a look at the SharedConfigPlugin.

The purpose of this plugin is to crawl the page hierarchy to find the closest sharedConfig found in any parent page's frontmatter.

• Finds all index pages among the source docs
• Deserialises those pages so it can read the frontmatter and content of the page
• If a property called sharedConfig in the page frontmatter is found a new file named shared-config.json is created
• Adds a ref named config to the shared config file that points to the shared config of the index page