Как создать список страниц в разделах для бокового меню в Wagtail?

Question

Я настоящий новичок в трясогузке. Как создать список страниц в разделах для бокового меню в Wagtail?

У меня, например, следующая структура сайта:

home/
    fruits/
        apples/
        oranges/
        grapes/
    vegetables/
        kale/
        spinach/
        cabbage/

home имеет тип HomePage с использованием шаблона home_page.html, а все подстраницы имеют тип ContentPage с использованием шаблона content_page.html.

Я хочу создать боковое меню для всех страниц контента, перечислив все страницы в их группах. Например, этот список:

Fruits
Apples
Oranges
Grapes

должно быть боковым меню для страниц fruits, apple, oranges и grapes.

page.get_children в шаблоне только перечисляет, если у страницы есть дочерние элементы, поэтому в этом случае просто fruits и vegetables.

Как бы я занялся созданием этого sidemenu?

Примеры в документации Wagtail, по-видимому, подразумевают, что у меня не может быть просто общего типа контента, такого как ContentPage, чтобы иметь тот вид списка, который я хочу, это правда?

Спасибо большое!

Answer 1

добро пожаловать в трясогузку!

Как и в большинстве веб-разработок, есть несколько способов сделать это.Самое простое понять, когда вы только начинаете, это сделать все это через шаблон.Таким образом, в вашем home_page.html вы можете иметь:

{% for parent in page.get_children %}
    Page title: {{ parent.title }} <br />

    {% if parent.get_children.count %}
        {% for child in parent.get_children %}
            - Child page title: {{ child.title }}<br/>
        {% endfor %}
    {% endif %}
{% endfor %}

Что это делает:

1. Прокручивает дочерние страницы HomePage (помеченные как parent в этом цикле)и печатает Page title: {title_here}
2. Затем он проверит дочерние страницы каждой итерации цикла parent и напечатает - Child page title: {child_title}

Хотя здесь есть недочёт.Это будет работать только на шаблоне home_page.html.Как только вы перейдете к /fruits/, он попытается выполнить ту же логику, но на этот раз он будет думать, что Fruits - это новый HomePage

. Здесь можно выбрать 2 опции.

1. Вы можете добавить пользовательский контекст на каждую страницу, чтобы убедиться, что вы всегда пропускаете HomePage и проходите через него.Это самый простой способ, и я покажу вам код ниже.Или
2. Вы можете создать систему меню, используя модель Джанго и зарегистрировав класс меню как фрагмент трясогузки.У меня есть видео со всем доступным исходным кодом, если вы хотите глубже погрузиться в трясогузку (https://www.youtube.com/watch?v=Y8a9ROUUJXU)

Чтобы добавить HomePage к каждому ContentPage, вы можете добавить его в контексткаждой страницы, например, так:

class ContentPage(Page):

    # Fields here

    def get_context(self, request, *args, **kwargs):
        """Adding HomePage to your page context."""
        context = super().get_context(request, *args, **kwargs)
        context["home_page"] = HomePage.objects.first()
        return context

И в своих шаблонах вы будете писать:

    {% for child_page in home_page.get_children %}
        Page title: {{ child_page.title }} <br />

        {% if child_page.get_children.count %}
            {% for grandchild_page in child_page.get_children %}
                - Child page title: {{ grandchild_page.title }}<br/>
            {% endfor %}
        {% endif %}
    {% endfor %}

Редактировать: Если вы находитесь на странице внука, например, /fruits/apples/ и хотите отобразить заголовок родительской страницы, и все родственные страницы (т. е. /fruits/oranges/ и /fruits/grapes/), которые вы можете циклически просматривать на страницах родственного брата. Примерно так должно работать:

<!-- On `/fruits/` this will be the Home Page title. On `/fruits/apples/` this will be the Fruits page title. -->
<h2>{{ self.get_parent.title }}<h2>

{% for sibling in self.get_siblings %}
   <a href="{{ sibling.url }}">{{ sibling.title }}</a>
{% endfor %}