Startseite
  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche
Startseite › Forum › Drupalcenter.de › Themes & Theming ›

Twig Custom Menu: Frage zu macro und Variablen

Eingetragen von cdash (23)
am 27.10.2021 - 13:21 Uhr in
  • Themes & Theming
  • Drupal 9.x

Hallo Ihr Lieben,

ich arbeite an einem eigenen Theme mit Bootstrap 5. Für eine vertikale Navigation bei der ich Bootstrap Accordions verwende habe ich eine eigene menu.twig.

Bis auf ein Details funktioniert die Navigation auch, ich kann keine individuellen Attribute für dei Accordions erstellen. Das lässt mich aber doch etwas daran zweifeln ob ich das macro richtig verstanden habe.

Hier mein twig

{% import _self as menus %}

{#
  We call a macro which calls itself to render the full tree.
  @see https://twig.symfony.com/doc/1.x/tags/macro.html
#}
{{ menus.menu_links(items, attributes, 0, 0) }}

{% macro menu_links(items, attributes, menu_level, accordion_nr) %}
  {% import _self as menus %}
  {% if items %}
  {% for item in items %}     
      {# Wenn der Navigationspunkt Unterpunkte hat Accordion erstellen #}     
      {% if item.is_expanded %}  
      {% set accordion_nr = accordion_nr + 1 %}        
      <li class="accordion {{ 'accordion--level' ~ (menu_level + 1) }}" id="{{ 'accordionNr' ~ accordion_nr }}">
          <div class="accordion-item">
            <h3 class="accordion-header" id="{{ 'heading-' ~ accordion_nr }}">
              <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="{{ '#collapse' ~ accordion_nr }}" aria-expanded="false" aria-controls="{{ 'collapse' ~ accordion_nr }}">
                {# Den Titel des ersten Navigationspunkts als Accordion Header verwenden #}
                {{ item.title }} {{ accordion_nr }}
              </button>
            </h3>
            <ul id="{{ 'collapse' ~ accordion_nr }}" class="{{ 'accordion-body accordion-collapse collapse nav-list--level' ~ (menu_level + 1) }}" aria-labelledby="{{ 'heading' ~ accordion_nr }}" data-bs-parent="{{ '#accordion-menu' ~ accordion_nr }}">
            {% set level_up = 1 %}
      {% endif %}
      {# Einfache Navigationspunkte erstellen #}
       <li class="nav-item {{ 'nav-item--level' ~ (menu_level + level_up + 1) }}">
        {{ link(item.title, item.url, { 'class': 'nav-link' }) }}

        {{ menus.menu_links(item.below, attributes, menu_level + 1, accordion_nr) }}

      {% if item.is_expanded %}
            </ul>
        </div>
      {% endif %}
      </li>
    {% endfor %}
  {% endif %}
{% endmacro %}

Hier mein Problem

Für jedes Accordion benötige ich jeweils individuelle Werte für diverse korrespondierende Attribute wie z.B. data-bs-toggle auf dem Accordion Button und die ID des collapse Elements. Dafür habe ich mir die Variable accordion_nr erstellt die ich jedes Mal wenn ein Accordion erstellt wird + 1 hochzähle. Das funktioniert aber nicht. Für die Accordions auf der ersten Ebene wir die Variable wie erwartet hochgezählt, aber bei verschachtelten Accordions beginnt die Zählung ausgehend vom übergeordneten Accordion.

Ebene 1

accordion_nr 1
accordion_nr 2
accordion_nr 3
accordion_nr 4
accordion_nr 5

Verschachtelte Ebenen

accordion_nr 1
|__accordion_nr 2
|__accordion_nr 3
|__accordion_nr 4
|__accordion_nr 5
accordion_nr 2
|__accordion_nr 3
|__accordion_nr 4
|__accordion_nr 5
|__accordion_nr 6
|__accordion_nr 5
|__accordion_nr 6
accordion_nr 3
accordion_nr 4
accordion_nr 5

Für mein Verständnis wird bei jedem Durchlauf des Macros wenn der Menüpunkt Unterpunkte hat die Variable hochgezählt? Kann mir das jemand erklären wie dieses Macro funktioniert? Ich dachte wenn ich beim erneuten Aufruf accordion_nr übergebe passt das?

Vielen Dank

‹ Themeauswahl bei Portierung vorhandener Website (Anfänger) Layout Builder D9 Performance ›
  • Anmelden oder Registrieren um Kommentare zu schreiben

Benutzeranmeldung

  • Registrieren
  • Neues Passwort anfordern

Aktive Forenthemen

  • Canvas Palette: Eine fertige Komponentenbibliothek für Drupal Canvas
  • Hilfe zu Updates oder Composer
  • Vergleich Drupal und Contao
  • [geloest] Blocks in Bootstrap nebeneinander darstellen und nicht untereinander
  • DrupalCamp Frankfurt 27-28 November 2026
  • Bitte mein Bentzerkonto löschen
  • Beim Aufruf einiger Inhalte erhalte ich folgende Fehlermeldung
  • Neuinstallation: vermutlich ein rewrite-Problem
  • Drupal CMS installieren
  • [erledigt]MP3 in Drupal 10 einbinden
  • (gelöst)Drupal 11 installieren
  • Titel ausblenden
Weiter

Neue Kommentare

  • Danke ich werde mir die
    vor 3 Tagen 5 Stunden
  • Vielen Dank für Ihren
    vor 5 Tagen 23 Stunden
  • Composer ist sehr ratsam
    vor 1 Woche 22 Stunden
  • Vielen Dank für den
    vor 1 Woche 3 Tagen
  • Die alten CMS Vergleiche von contentmanager.de
    vor 1 Woche 3 Tagen
  • Gut gemacht
    vor 1 Woche 3 Tagen
  • Layout Builder etc. z.B. für Landing Pages
    vor 1 Woche 3 Tagen
  • Links
    vor 1 Woche 6 Tagen
  • Moin,wow, sehr gutes
    vor 2 Wochen 12 Stunden
  • Dass ist eine spannende
    vor 2 Wochen 19 Stunden

Statistik

Beiträge im Forum: 250316
Registrierte User: 20562

Neue User:

  • rofilm
  • Cruzorerm
  • Plandkeews

» Alle User anzeigen

User nach Punkten sortiert:
wla9466
stBorchert6003
quiptime4972
Tobias Bähr4019
bv3924
ronald3857
md3717
Thoor3678
Alexander Langer3416
Exterior2903
» User nach Punkten
Zur Zeit sind 0 User und 19 Gäste online.

Hauptmenü

  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche

Quicklinks I

  • Infos
  • Drupal Showcase
  • Installation
  • Update
  • Forum
  • Team
  • Verhaltensregeln

Quicklinks II

  • Drupal Jobs
  • FAQ
  • Drupal-Kochbuch
  • Best Practice - Drupal Sites - Guidelines
  • Drupal How To's

Quicklinks III

  • Tipps & Tricks
  • Drupal Theme System
  • Theme Handbuch
  • Leitfaden zur Entwicklung von Modulen

RSS & Twitter

  • Drupal Planet deutsch
  • RSS Feed News
  • RSS Feed Planet
  • Twitter Drupalcenter
Drupalcenter Team | Impressum & Datenschutz | Kontakt
Angetrieben von Drupal | Drupal is a registered trademark of Dries Buytaert.
Drupal Initiative - Drupal Association