Meta Data

Web pages have a special area at the top of the page for Meta data. Meta data defines properties for the page that can be passed to layout pages, partial pages and scripts to modify their behavior.

Defining Meta Data

Meta data is defined in several sources

• Top level expansive.json
• Content directory level expansive.json files
• Content pages
• Layout pages
• Partial pages

When Expansive renders a file, it aggregates the meta data for the page by blending the meta data from these sources. These sources are blended in this order with the latter sources overwriting the meta data from prior sources. Note: meta data flows one way, top down. There is no way to globally set meta data from a subdirectory expansive.json file or from a content page.

Top Level Meta Data

The top level expansive.json file defines the global meta data inherited by all pages. This is where you should define the web site's home url via the site property.

Directory Level Meta Data

To help partition an application, meta data may be defined by per-directory expansive.json files. These files define meta data that applies to all pages in that directory or in subdirectories below.

Content Page Meta Data

Content pages define meta data inline at the top of the page. This meta data applies only to the page itself and is also passed to layout and partial pages as they are processed for the content page.

Meta Data Files

To define meta data in expansive.json files, set the required property values in the meta property collection. For example:

{
    meta: {
        property: 'value'
    }
}

Content Meta Data

To define meta data in a content, partial or layout page, set the required property values in the meta data section at the top of the page. For example, consider the page contents/index.html.

{
    color: 'red',
    title: 'Hello World'
}    

<p>Hello World</p>

This Meta data defines two properties meta.color and meta.title for this page.

JSON Syntax

Expansive supports a relaxed JSON syntax where property keys do not have to be quoted, and you can use a comma after the last property in an array or hash. Further, multiline strings are supported and may be delimited by single, double or back-tick quotes.

The Meta section may contain any JSON object, so multiple property levels are permitted.

{
    user: {
        name: 'George'
        age: 42,
        address: "1717 Cherry Lane
          London
          UK"
    }
}    

Accessing Meta Data

Meta data may be accessed in pages or scripts via the meta global script property.

<p>Favorite Color is: <@= meta.color @></p>

For debugging, you can print properties or dump all the meta data to the expansive console.

<@ 
    print("COLOR", meta.color) 
    dump("META", meta)
@>

Meta Properties

These are the standard, pre-defined Meta properties available in content, layout and partial pages.

Layouts

A content page can request a different layout by adding a layout property to the meta data section of the content page. For example:

{
    layout: 'product-layout'
    title:  'Hello World'
}    
<h1>Hello World with Layouts</h1>

This will select the product-layout in the layouts directory. Set the layout property to the empty string "" to disable layout processing. Expansive uses the presence of a meta data section to enable layout processing. If you omit meta data in your page, you will disable layout processing.

Partial Pages

You can pass one-off meta data parameters to a partial page without changing the general meta for the page. Do this via the partial() function call. For example:

<@ partial('hero', { color: 'rec' }) @>