[SOLVED] What is the proper way to include partial in liquid templates in eleventy 1?

What is the proper way to include partial in liquid templates in eleventy 1?

Given the following file structure:

root/
  src/
    _includes/
      partials/
        navbar.liquid
        footer.liquid
        address.liquid
      base.liquid
    index.liquid

How do I include partials/navbar.liquid and partials/footer.liquid in base.liquid and include partials/address.liquid in partials/footer.liquid ?

NOTE: This behavior has changed in version 1 and I cannot figure out the new model. A working solution would be a great addition to the 11ty documentation.

Solution

Your project structure looks good. I created a demo locally using Eleventy v1.0.1 and the {% include %} logic works as expected with liquid templates when the correct template filepaths are provided.

src/_includes/base.liquid

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>11ty demo</title>
</head>
<body>
    {% include "./partials/navbar.liquid" %}
    {{ content }}
    {% include "./partials/footer.liquid" %}
</body>
</html>

src/index.liquid

---
layout: base.liquid
pageTitle: 11ty demo
---

<h1>{{ pageTitle }}</h1>
<p>Some content</p>

Partials

src/_includes/partials/navbar.liquid

<nav><a href="/">Home Page Link</a></nav>

src/_includes/partials/address.liquid

<p>221 Some address info</p>

src/_includes/partials/footer.liquid

{% include "./address.liquid" %}
<nav><a href="/">Footer link</a></nav>

After performing a build with npx @11ty/eleventy and then serving the site with npx @11ty/eleventy --serve. Below is the generated site output: