Partial content

One of the most important concepts with Amagaki is the partial loop. Most pages
on marketing and informational websites are assembled by mixing and matching
reusable sections or templates – in Amagaki, these are called partials.

A partial is a reusable, content-agnostic template that is designed to be
reused, mixed, and matched in pages. Partials are meant to be independent of one
another and completely isolated such that there are minimal, or no dependencies
beyond the content injected into the partial.

The partial loop

Within a content document, the partial loop is represented by a list of
partials, like this:

partials:
 
# Renders: /views/partials/hero.njk
# Loads:   /src/sass/partials/hero.sass
- partial: hero
  headline: Page headline
# Renders: /views/partials/spacer.njk
# Loads:   /src/sass/partials/spacer.sass
- partial: spacer
# Renders: /views/partials/columns.njk
# Loads:   /src/sass/partials/columns.sass
- partial: columns
  header:
    headline: Columns headline
    body: Columns body.
  columns:
  - headline: Column 1 headline
  - headline: Column 2 headline

Within Amagaki’s default base template, the content document’s partials are
looped over, rendering one at a time. Each partial’s rendering context is
populated by its content from the partial loop:

<div class="columns">
  <div class="columns__header">
    <div class="columns__header__headline">
      {{partial.header.headline}}
    </div>
    <div class="columns__header__body">
      {{partial.header.body}}
    </div>
  </div>
  <div class="columns__columns">
    {% for column in partial.columns %}
      <div class="columns__columns__column">
        {{column.headline}}
      </div>
    {% endfor %}
  </div>
</div>

In summary, each document should be rendered as an assembly of partials, with an
overall anatomy of:

• The list of partials within the document
• The data within each partial in the partial loop
• The partial template – within /views/partials/<partial>
• The partial templates CSS – within /src/sass/partials/<partial>

As your site evolves over time, you can easily create new partials, mix and
match partials, and manage them all independently of one another. Note that even
if a page has a section that will never be reused on another page, you should
still build that page as a list of partials for consistency.