Unibit layouts and components can access two global variables

  • site - a global object allowing access to different site aspects
  • page - an object representing the page currently rendered by the layout

Site Variables

The following site variables are available in the config.yml

  • baseurl - site base URL
  • title - site title
  • params - site user defined parameters
  • menus - site menus, see the Menus section for more info
# config.yaml

baseurl: "/"
title: "Universal"
params:
  logo: 'images/logo.svg'
menus: 
  main:
    - identifier: home
      weight: 1
      url: /
      title: Home

You can access site variables in a layout

<!-- layouts/home.html -->

<div class="container">
    <h1>{{ site.title }}</h1>
</div>

You can access site variables in a component

<!-- components/header.html -->

<header class="site-header">
    <div>
    <img class="site-logo" src="{{ site.params.logo | relative_url }}"/>
    <h1 class="site-title"><a href='{{ "site.baseURL" | relative_url }}'>{{ site.title }}</a></h1>
  </div>
  {% if site.menus.main %}
  <nav class="site-navigation">
    {% set menu = site.menus.main %}
    {% set include_dict = {"menu": menu, "page": page} %}
    {% include "menu.html" %}
  </nav>
  {% endif %}
</header>

Page Variables

Page variables come from the front matter of a content file.

  • title - the title of the page. If title was defined in front-matter, its value will be used, otherwise page's filename will be used as title.
  • date - if date was defined in front-matter, its value will be used, otherwise page's file creation date will be used.
  • url - the url of the page relative to the site root including generated filename and excluding any base URL.
  • relPath - page path relative to the content folder (including basename)
  • absPath - absolute page path (including basename)
  • relDir - page directory path relative to the content folder
  • absDir - absolute page directory path
  • basename - page file name including the extension
  • filename - page file name excluding the extension
  • params - user defined front-matter page parameters
  • content - safe HTML content converted from markdown (no need to pass through safe filter)
  • markdown - original page markdown ({{ page.markdown | markdownify | safe }} == {{ page.content }})