Skip to content
Grav 2.0 is officially stable. Read the announcement →

Community guidelines

Please keep discussions civil and on-topic. Repeated violations may lead to a temporary ban.

General

Modular Page with Modules and Listings?

Started by amdival 5 years ago · 2 replies · 432 views
5 years ago

Hi,
I'm working on constructing a modular page, and would appreciate some direction.

This is what I am wanting:
essentially the page should be constructed in two steps: fill in the modular content, then fill in the children pages content. The modules will be block level and fill the whole horizontal space. The child pages will be displayed as a grid, and maybe paginated. The pagination is the last thing on the list, I need to get the rest of it working first.

[ base ]
[ module ]
[ module ]
[ module ]
[ module ]
[c] [c] [c] [c]
[c] [c] [c] [c]
[c] [c] [c] [c]
[c] [c] [c] [c]
[c] [c] [c] [c]

Is this the right approach? Should I be thinking of these things as modules and children? Is the terminology correct?

You can tell that I am trying to follow the example in the docs.

📁 01.page
. . . 📁 _callouts
. . . . . . 📄 text.md
. . . 📁 _features
. . . . . . 📄 text.md
. . . 📁 _highlights
. . . . . . 📄 text.md
. . . 📁 _showcase
. . . . . . 📄 text.md
. . . 📁 01.test01
. . . . . . 📄 product.md
. . . 📁 02.test02
. . . . . . 📄 product.md
. . . 📁 03.test03
. . . . . . 📄 product.md
. . . 📁 04.test04
. . . . . . 📄 product.md
. . . 📄 modular.md

This is my front matter:

YAML
---
title: Test Mod
content:
items: '@self.modular'
order:
    by: default
    dir: asc
    custom:
        - _showcase
        - _highlights
        - _callout
        - _features
products:
items: '@self.children'
filter:
    published: true
    type: 'product'
order:
    by: default
    dir: asc

---

This is my work-in-progress modular.html.twig:

TWIG
{% extends 'partials/base.html.twig' %}

{% block content %}

    {% for module in page.collection() %}
    {{ module.content|raw }}
    {% endfor %}

    {% for blurb in page.products() %}
    {{ blurb.content|raw }}
    {% endfor %}

{% endblock %}

It populates the navigation bar. I don't want that. I think I can fix that in the product.md front matter.

The modular section shows up, but the child pages section doesn't show up.

Any quick pointers or tips would be appreciated! I think I can work this all out, but I definitely wouldn't mind some tips to speed up the process :)

last edited 01/05/21 by amdival
5 years ago

I got part of it working. I think I have this.

I'm just looking for more seasoned advised as to if this is the correct approach.

TWIG
{% for blurb in page.collection('products') %}
{{ blurb.content|raw }}
{% endfor %}
5 years ago

Also found:
visible: false
for front matter to remove a listing from the navigation.

Suggested topics

Topic Participants Replies Views Activity
General · by Jerry Hunt, 4 days ago
2 76 7 hours ago
General · by pamtbaau, 13 hours ago
1 47 12 hours ago
General · by Andy Miller, 1 day ago
0 44 1 day ago
General · by Marcel, 12 months ago
6 346 5 days ago
General · by Duc , 5 days ago
3 40 5 days ago