Partials

Partials are files that you can include in a Template with the {% include %} tag.

Including

To include a Partial in a Template, use the Nunjucks {% include %} tag:

{% block template %}
  
  {% include "src/partials/example.njk" %}

{% endblock %}

The path to the Partial file must be:

• surrounded with quotes
• relative to the project root

The build will normally fail if the Partial file doesn't exist - if you're unsure whether the Partial will exist at that path at build time, use ignore missing:

{% include "src/partials/schrodinger-cat.njk" ignore missing %}

Read more about includes, in the Nunjucks docs ↗

Paths

Partials live in the src/partials directory in Maizzle, but you can keep them wherever you'd like - just be sure to update their purgeCSS and browsersync paths:

// config.js
module.exports = {
  cleanup: {
    purgeCSS: {
      content: [
        'src/partials/**/*.*', // update if needed
        'src/components/**/*.*',
        // ...
      ],
    },
  },
  browsersync: {
    watch: [
      'src/partials/**/*.*', // update if needed
      'src/components/**/*.*',
      // ...
    ],
  },
}

PurgeCSS needs that path, so that any Tailwind CSS classes in your Partials will not be removed when doing code cleanup. Likewise, Browsersync needs to know about it so it can automatically reload your page if a Partial changes.

Otherwise, you can of course include a partial from any location.