# How do I render a page as part of another page

**URL:** <https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020>\
**Category:** Support\
**Created:** [January 22, 2024, 10:14am UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020 "2024-01-22T10:14:30Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![kekkon](https://avatars.discourse-cdn.com/v4/letter/k/4491bb/32.png) [@kekkon](https://zola.discourse.group/u/kekkon)\
**Post date:** [January 22, 2024, 10:14am UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/1 "2024-01-22T10:14:30Z")

</div>

I tried searching around and maybe I’m not using the right words, but I couldn’t exactly find the functinality I wanted.

I am adapting a blog template and want to do the following: the complete and rendered HTML to be included in the index page of that section (aka, the blog articles are sequentially rendered in the index, instead of just a summary).

Is this possible? The paginator picks up the different articles but in the for loop page.content only gets me the content of that block, not the entire rendered page.

Can this be done in Zola and if so, how?

---

<div class="post-metadata">

**Author:** ![welpo](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/welpo/32/1087_2.png) [@welpo](https://zola.discourse.group/u/welpo)\
**Post date:** [January 22, 2024, 10:31am UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/2 "2024-01-22T10:31:41Z")

</div>

> [@kekkon](#):
>
> in the for loop page.content only gets me the content of that block, not the entire rendered page

What’s “the entire rendered page”? If it’s missing stuff like tags, title… then you would need to edit the templates.

Namely, whatever template is being used to render the entire content (each article by itself) would need to be introduced in whatever template is using the paginator (presumably `section.html`).

---

<div class="post-metadata">

**Author:** ![kekkon](https://avatars.discourse-cdn.com/v4/letter/k/4491bb/32.png) [@kekkon](https://zola.discourse.group/u/kekkon)\
**Post date:** [January 22, 2024, 11:54am UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/3 "2024-01-22T11:54:10Z")

</div>

This is what my for look currently looks like in the template:

```html
{% for page in paginator.pages | reverse %}
      <section class="post animated fadeInDown">
        <div class="post-title">
                <h3><a href="{{ page.permalink }}">{{ page.title }}</a></h3>
        </div>
        <div class="post-content">
              <p>
                {{ page.content }}
              </p>
        </div>
        <div class="post-footer">
              <div class="meta">
                <div class="info">
                  {% if page.date %}
                    <i class="far fa-sun"></i>
                    <span class="date">
                      {{ page.date | date(format=trans(key="date_format", lang=lang)) }}
                    </span>
                  {% endif %}
                  {% if page.taxonomies.tags %}
                    <i class="fas fa-tags"></i>
                    {% for tag in page.taxonomies.tags %}
                      <a class="tag" href="{{ get_taxonomy_url(kind="tags", name=tag, lang=page.lang) | safe }}">&nbsp;{{tag}}</a>
                    {% endfor %}
                  {% endif %}
                </div>
              </div>
        </div>
      </section>
    {% endfor %}

```

I have multiple pages in this section that I want to include in full in the main page. I am not sure how I can include that template in the main page and still keep the article rendering like all the separate frontmatter for those articles.

So instead of just including the content as it does now, I want it to render the template of that article and include that html in the section where it now says `{{ page.content }}` in the for-each.

---

<div class="post-metadata">

**Author:** ![kekkon](https://avatars.discourse-cdn.com/v4/letter/k/4491bb/32.png) [@kekkon](https://zola.discourse.group/u/kekkon)\
**Post date:** [January 29, 2024, 10:44am UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/4 "2024-01-29T10:44:52Z")

</div>

I’m gonna guess that this is something Zola can’t do right now, because of the silence?

---

<div class="post-metadata">

**Author:** ![adrianboston](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/adrianboston/32/907_2.png) [@adrianboston](https://zola.discourse.group/u/adrianboston)\
**Post date:** [January 31, 2024, 2:57am UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/5 "2024-01-31T02:57:31Z")

</div>

you might be thinking of `[tera macros](https://keats.github.io/tera/docs/#macros)’

resuable elements that could be used in various places.

they are placed under `temples > macro` folder.

---

<div class="post-metadata">

**Author:** ![spence](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/spence/32/1022_2.png) [@spence](https://zola.discourse.group/u/spence)\
**Post date:** [February 1, 2024, 9:00pm UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/6 "2024-02-01T21:00:29Z")

</div>

I don’t think there’s support for what you want, in exactly the way you describe, sorry. As mentioned elsewhere macros are probably the most idiomatic way of doing this and what I’d recommend.

However, if you still want to do it, I think that there might be a way to emulate the same behavior that you were describing, although I haven’t tried it myself and I think that it might not work with template inheritance.

Let’s say you have a page called `page1.md` as follows:

```md
+++
template = "example.html"
+++
this is an example

```

So that page above has a template called `example.html`. If you wanted to “render” the html of `page1.md` but in the code you showed above, you _may_ be able to do so by using `{% include "example.html" %}`. What’s going to happen is whatever variables you have in the outer template will be made available to `example.html` when `include` is used. So, if you have a variable called `page` for example, and that’s what `example.html` normally uses, then you can probably emulate what you wanted.

Where I think this may be a problem for you is if have any kind of inheritance in your page’s template. I don’t think using `includes` and using `extends` really mix very well.

Again, I haven’t tested this myself, but I think it’s possible. Hope that helps!

---

<div class="post-metadata">

**Author:** ![welpo](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/welpo/32/1087_2.png) [@welpo](https://zola.discourse.group/u/welpo)\
**Post date:** [February 6, 2024, 10:45pm UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/7 "2024-02-06T22:45:42Z")

</div>

> [@kekkon](#):
>
> So instead of just including the content as it does now, I want it to render the template of that article and include that html in the section where it now says `{{ page.content }}` in the for-each.

Isn’t it enough to replace the `{{ page.content }}` line with the actual template that renders the page?

For example, I render a list of posts with [this macro](https://github.com/welpo/tabi/blob/main/templates/macros/list_posts.html). As you can see, it shows some metadata (tags, date) and the summary.

If I wanted to “embed” the actual post content on the listing, I would modify this “list all posts” template so that, for each post, it renders whatever is visible on the actual post page (date, headers… whatever).

---

<div class="post-metadata">

**Author:** ![kekkon](https://avatars.discourse-cdn.com/v4/letter/k/4491bb/32.png) [@kekkon](https://zola.discourse.group/u/kekkon)\
**Post date:** [February 7, 2024, 2:48pm UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/8 "2024-02-07T14:48:27Z")

</div>

How would I make it render everything for every page in the page collection? Including the front matter of those pages?

---

<div class="post-metadata">

**Author:** ![welpo](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/welpo/32/1087_2.png) [@welpo](https://zola.discourse.group/u/welpo)\
**Post date:** [February 7, 2024, 3:46pm UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/9 "2024-02-07T15:46:11Z")

</div>

The same way it’s being rendered in the individual article’s template: by accessing the proper variables (e.g. accessing `post.date` from my macro link).

---

<div class="post-metadata">

**Author:** ![kekkon](https://avatars.discourse-cdn.com/v4/letter/k/4491bb/32.png) [@kekkon](https://zola.discourse.group/u/kekkon)\
**Post date:** [February 19, 2024, 12:18pm UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/10 "2024-02-19T12:18:53Z")

</div>

> [@welpo](#):
>
> template: by accessing the proper variables (e.g. accessing `post.date` from my macro link).

I tried that, but then I get an error accessing `page.extra` variables to get my custom frontmatter.

Caveat: I didn’t use the macro, just adjusted the template of my index page.

---

<div class="post-metadata">

**Author:** ![welpo](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/welpo/32/1087_2.png) [@welpo](https://zola.discourse.group/u/welpo)\
**Post date:** [February 19, 2024, 1:15pm UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/11 "2024-02-19T13:15:08Z")

</div>

I don’t know what to tell you. I just tested it, just in case, and I was able to access `extra` variables as expected.

Perhaps your Tera logic needs fixing? If not all posts have a particular `extra` variable, you need to first check whether it exists.

For example, this will fail if a single post doesn’t have the `foo` variable:

```tera
Post's foo: {{ post.extra.foo }}

```

This will work:

```tera
{% if post.extra.foo %}
Post's foo: {{ post.extra.foo }}
{% endif %}

```

---

<div class="post-metadata">

**Author:** ![adrianboston](https://yyz2.discourse-cdn.com/free1/user_avatar/zola.discourse.group/adrianboston/32/907_2.png) [@adrianboston](https://zola.discourse.group/u/adrianboston)\
**Post date:** [February 24, 2024, 2:29am UTC](https://zola.discourse.group/t/how-do-i-render-a-page-as-part-of-another-page/2020/12 "2024-02-24T02:29:52Z")

</div>

> [@kekkon](#):
>
> I am adapting a blog template and want to do the following: the complete and rendered HTML to be included in the index page of that section (aka, the blog articles are sequentially rendered in the index, instead of just a summary).

Create a MACRO from your current PAGE template and then use it in the SECTION template. replacing {{ page.content}} with the call to that new macro.

You do need to make some templates.