Modular as footer text

Archive
1

Hi!
I love the functionality of the modular.

I would like to add a module inside of the footer region, but right now I can only get it to render inside the “Content”. How do I create a modular and get it to render inside of a different region than “block content” ex “block footer”

This is my markup shortened.

<header>Content</header>
<section>
   <div>Partial static content</div>
   <div>--Modular dynamic content--</div>
   <div>Partial static content</div>
</section>
<footer>--Modular dynamic content--</footer>

This is how the part of the modular.html.twig file looks.

{% block content %}
    {% include 'partials/static-content.html.twig' %}
    {{ page.modular-dynamic-content-1 }}
    {% include 'partials/static-content.html.twig' %}
{% endblock %}

{% block footer %}
    {{ page.modular-dynamic-content-2 }}
{% endblock %}

Frontmatter

content:
    items: '@self.modular'
    order:
        by: default
        dir: asc
        custom:
            - _modular-dynamic-content-1
            - _modular-dynamic-content-2
---
2

This is more of a question on how to control where the modular is being outputted inside of the html.twig template file.

So if I want some partial before and after a modular, how do I achieve this? :slight_smile:
Right now all the modular are being place just after each other, and I can’t figure out how to place partial inbetween.

Like

{% include 'partials.html.twig' %}
{{ page.modular }}
{% include 'partials.html.twig' %}
{{ page.modular }}

Thanks

3

By default modular pages are used to display in main content one after the other, modular pages are called in a loop, then you cant out of the box stop the loop and call a desired partials content.

Seems like you are seeing partials strictly as static content, but you could have partial twig to render dynamic content. page.find() is your friend for this task.

For your footer this is my approach:

Add your dynamic content in a regular page ie. /partials/dinamic1/default.md

then you could have a partials.dinamic1.html.twig file

{% p=page.find('/partials/dinamic1') %}
{{ p.content }}

Now you have a partial that actually renders content of a dinamic page, and you could include the partials.dinamic1.html.twig wherever you need in other twig files.

For modular pages that needs fixed content between modules just do the opesite, I mean, you could do a modular/partialx.html.twig file wich only includes a partial twig file.

{% include 'partials/partial-x.html.twig' %}

Then simply add that modular page to your modules stack

4

Ah that makes sense.
Modular pages are only for stacking and not for ordering in weird ways.
I’ll try to create a page, create a partial that includes that and put there were I want.

Thanks for the respond and for directing me in the right directing!

5

Hi @HugoAvila,
I can’t get it to work.

I’ve create a new regular page which is located “pages/footer”.
Then I created a partial where I pasted in your code

{% p=page.find('/partials/dinamic1') %}
{{ p.content }}

and changed it so it fits my location.

{% p=page.find('/pages/footer') %}
{{ p.content }}

Now I guess that the partial would just include the content of the footer page, but I get an twig_error:
Unknown "p" tag. Did you mean "import", "spaceless", "autoescape"
in "partials/footer.html.twig" at line 1?
and I can see that inside of my editor it highlights the p in “p=page.find” as if it were incorrect.

Do you have an idea on what might could be the problem?

Thanks, Mads

6

Sorry my mistake in twig sintax, this should work:

{% set p=page.find('/pages/footer') %}
{{ p.content }}

notice set is missing in my original post