Layout files

A layout file is a special segment file that composes the shape of a web page. A layout file has .html extension, and the default name is layout.html. The name of the default layout file can be set in the configuration. The layout files belong to the /components. A site must have a default layout file, that is achievable in two ways:

There is a layout file in the root of the components directory.
There is a layout file in each language directories of the components directory.

If there is a layout file in the root directory and another with same name in a language directory, then the language specific one is used. A layout file differs from the segment files in one thing only:

The layout file has a content segment ({{ content }}).

The layout file used rendering a page can be overwritten in the metadata of the content. A simple layout file can look like this:

<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container-fluid">
    <div class="row">
      <div class="col-lg-12 col-md-12 col-sm-12">
        <div class="navbar-header">
          <a class="navbar-brand" href="/">{{ =brand }}</a>
        </div>
        <div class="collapse navbar-collapse" id="navbar-collapse-menu">
          {{ #bootstrap-navbar }}
        </div>
      </div>
    </div>
  </div>
</nav>

<div class="container-fluid">
  <div class="col-lg-12 col-md-12 col-sm-12">
    {{ content }}
  </div>
</div>

The example displays a simplified Bootstrap navigation bar also.

Documentation

Layout files