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 - 12: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

  • für drupal11 ein Slider Modul
  • [gelöst] W3CSS Paragraphs Views
  • Drupal 11 neu aufsetzen und Bereiche aus 10 importieren
  • Wie erlaubt man neuen Benutzern auf die Resetseite zugreifen zu dürfen.
  • [gelöst] Anzeigeformat Text mit Bild in einem Artikel, Drupal 11
  • Social Media Buttons um Insteragram erweitern
  • Nach Installation der neuesten D10-Version kein Zugriff auf Website
  • Composer nach Umzug
  • [gelöst] Taxonomie Begriffe zeigt nicht alle Nodes an
  • Drupal 11 + Experience Builder (Canvas) + Layout Builder
  • Welche KI verwendet ihr?
  • Update Manger läst sich nicht Installieren
Weiter

Neue Kommentare

  • melde mich mal wieder, da ich
    vor 1 Tag 13 Stunden
  • Hey danke
    vor 2 Tagen 8 Stunden
  • Update: jetzt gibt's ein
    vor 3 Tagen 2 Stunden
  • Hallo, im Prinzip habe ich
    vor 1 Woche 12 Stunden
  • Da scheint die Terminologie
    vor 1 Woche 15 Stunden
  • Kannst doch auch alles direkt
    vor 1 Woche 4 Tagen
  • In der entsprechenden View
    vor 1 Woche 4 Tagen
  • Dazu müsstest Du vermutlich
    vor 1 Woche 4 Tagen
  • gelöst
    vor 4 Wochen 1 Tag
  • Ja natürlich. Dass ist etwas,
    vor 4 Wochen 2 Tagen

Statistik

Beiträge im Forum: 250233
Registrierte User: 20449

Neue User:

  • Mroppoofpaync
  • 4aficiona2
  • AppBuilder

» Alle User anzeigen

User nach Punkten sortiert:
wla9461
stBorchert6003
quiptime4972
Tobias Bähr4019
bv3924
ronald3857
md3717
Thoor3678
Alexander Langer3416
Exterior2903
» User nach Punkten
Zur Zeit sind 0 User und 10 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