Themes Menu

🧭 1. Najpierw: skąd Grav bierze menu?

Menu nie tworzy się w Twig na sztywno — tylko z:
👉 struktury katalogu /user/pages/
👉 + opcjonalnie menu: w nagłówkach stron

📁 2. Struktura stron (to jest klucz)

Masz coś takiego:

/user/pages/
├── 01.home/
│   └── default.md
├── 02.blog/
│   └── blog.md
├── 03.about/
│   └── default.md

👉 numer = kolejność w menu
👉 katalog = strona

✏️ 3. Nagłówki stron (opcjonalnie)

W pliku np.: /user/pages/02.blog/blog.md dodaj:

title: Blog
menu: Blog
visible: true

• menu: → nazwa w menu
• visible: true → pokazuje w menu

🧩 4. Kod menu w Twig (najważniejsze)

W swoim motywie (np. base.html.twig albo default.html.twig) dodaj:

<nav>
  <ul>
    {% for page in pages.children.visible %}
      <li>
        <a href="{{ page.url }}">{{ page.menu }}</a>
      </li>
    {% endfor %}
  </ul>
</nav>

I to już działa 🎯

📌 5. Jeśli jesteś na stronie HOME

To ważne:

👉 pages.children = strony na poziomie głównym czyli dokładnie to, czego chcesz

🎯 6. Aktywna strona (highlight)

Dodaj klasę:

<li class="{% if page.active %}active{% endif %}">

czyli:

<nav>
  <ul>
    {% for p in pages.children.visible %}
      <li class="{% if p.active %}active{% endif %}">
        <a href="{{ p.url }}">{{ p.menu }}</a>
      </li>
    {% endfor %}
  </ul>
</nav>

🔥 7. Najczęstszy problem (pewnie u Ciebie też)

👉 menu się nie pokazuje?
Sprawdź:
✔ czy strony mają:

visible: true

✔ czy NIE masz:

visible: false

✔ czy foldery mają numerki:

01.home
02.blog

💡 Bonus: dropdown (podstrony)

Jeśli chcesz menu z podstronami:

{% for p in pages.children.visible %}
  <li>
    <a href="{{ p.url }}">{{ p.menu }}</a>

    {% if p.children.visible|length > 0 %}
      <ul>
        {% for child in p.children.visible %}
          <li>
            <a href="{{ child.url }}">{{ child.menu }}</a>
          </li>
        {% endfor %}
      </ul>
    {% endif %}

  </li>
{% endfor %}

🚀 Podsumowanie

Najważniejsze 3 rzeczy:

✔ struktura katalogów = menu
✔ visible: true
✔ pętla Twig pages.children.visible