Apply layout for pages accessed via site.pages.content - jekyll

Question

I’m trying to render specific md file inside of html using code:
{% assign subheader = site.pages | where: "title", "subheader" | first %}
{{ subheader.content }}
It works, but my layout isn’t respected. Does it work as expected? Is there a way to apply this layout?

Answer 1

Layouts are applied in context to the "current page".
In your example, if {{ subheader.content }} has been inserted into say, base.md that defines a layout: base in the front matter, then {{ subheader.content }} is rendered as part of "base.md" and will therefore be a part of its layout (_layouts/base.html).
There is no out-of-the-box way to render individual sections of a page rendered with multiple layouts.
The only possible route is to inherit another layout.
For example,
say I have a "base" layout with following:
[...]
<header>
<div id="parent-element">
<div class="btn">foo</div>
{{ content }}
</div>
</header>
[...]
and another layout subheader:
---
layout: base
---
<ul id="greek">
<li>alpha</li>
<li>beta</li>
<li>gamma</li>
</ul>
{{ content }}
and finally a "page.md" that uses the subheader layout:
---
layout: subheader
---
<ul id="fruits">
<li>apples</li>
<li>oranges</li>
<li>bananas</li>
</ul>
Then, the generated "page.html" will be:
[...]
<header>
<div id="parent-element">
<div class="btn">foo</div>
<ul id="greek">
<li>alpha</li>
<li>beta</li>
<li>gamma</li>
</ul>
<ul id="fruits">
<li>apples</li>
<li>oranges</li>
<li>bananas</li>
</ul>
</div>
</header>
[...]