---
url: 'https://dxpr.com/pl/hc/dokumentacja/nauka-dxpr-theme/dostosowanie-motywu-low-code/responsywne-wielopoziomowe-mega-menu-w-motywie-dxpr'
title: 'Responsywne wielopoziomowe mega menu w motywie DXPR | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T00:28:51+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: 'Motyw DXPR buduje swoje mega menu na systemie menu samego Drupala. Strukturę tworzysz w Struktura › Menu; motyw zamienia ją w menu rozwijane, które dzielą się na kolumny wraz ze wzrostem, zagnieżdżają się na trzy poziomy, otwierają po najechaniu lub kliknięciu i zwijają się w menu hamburger na telefonach. Bez modułu mega menu, bez dodatkowej konfiguracji; te same odnośniki obsługują komputer i telefon.'
tags:
  - 'Low-code theme customization'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T00:28:51+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      '@type': FAQPage
      mainEntity:
        -
          '@type': Question
          name: 'Czy z DXPR Theme potrzebuję modułu mega menu?'
          acceptedAnswer:
            '@type': Answer
            text: '<p>Nie. Kolumny, trzy poziomy, hover i klik, obsługa klawiatury i menu mobilne pochodzą z motywu. Wystarczy zagnieżdżone menu z <em>Pokaż jako rozwinięte</em> u rodziców albo <em>Rozwiń wszystkie odnośniki menu</em> w bloku menu.</p>'
        -
          '@type': Question
          name: 'Dlaczego moje menu otwiera się tylko po kliknięciu?'
          acceptedAnswer:
            '@type': Answer
            text: '<p>Bo gdzieś w menu jakieś menu rozwijane ma trzeci poziom. Motyw przełącza wtedy całe menu na obsługę wyłącznie klikiem, aby podmenu nie zamykało się, gdy wskaźnik do niego wędruje. Spłaszcz strukturę do dwóch poziomów, aby hover działał wszędzie. Ekrany dotykowe i okna węższe niż 992 piksele zawsze używają kliku.</p>'
        -
          '@type': Question
          name: 'Jak uzyskać mega menu na pełną szerokość?'
          acceptedAnswer:
            '@type': Answer
            text: '<p>Daj menu rozwijanemu co najmniej 15 bezpośrednich dzieci. Od 3 kolumn rozciąga się na pełną szerokość nagłówka. Przy 8–14 dzieciach dostajesz dwie kolumny pod odnośnikiem rodzica; mniej zostaje jedną kolumną.</p>'
        -
          '@type': Question
          name: 'Czy odnośnik rodzica otworzy menu, nie prowadząc donikąd?'
          acceptedAnswer:
            '@type': Answer
            text: '<p>Tak. Podczas edycji elementu menu wpisz &lt;nolink&gt; albo &lt;button&gt; jako odnośnik; oba są wbudowane w jądro Drupala. Rodzic przełącza wtedy swoje menu i nie ma własnej strony.</p>'
    -
      '@type': TechArticle
      headline: 'Responsywne wielopoziomowe mega menu w motywie DXPR'
      description: 'Motyw DXPR buduje swoje mega menu na systemie menu samego Drupala. Strukturę tworzysz w Struktura › Menu; motyw zamienia ją w menu rozwijane, które dzielą się na kolumny wraz ze wzrostem, zagnieżdżają się na trzy poziomy, otwierają po najechaniu lub kliknięciu i zwijają się w menu hamburger na telefonach. Bez modułu mega menu, bez dodatkowej konfiguracji; te same odnośniki obsługują komputer i telefon.'
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T00:28:51+0000'
      dateModified: '2026-10-24T00:28:51+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/pl/hc/dokumentacja/nauka-dxpr-theme/dostosowanie-motywu-low-code/responsywne-wielopoziomowe-mega-menu-w-motywie-dxpr'
      articleSection: 'Motywy bez kodowania'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/pl/hc/dokumentacja/nauka-dxpr-theme/dostosowanie-motywu-low-code/responsywne-wielopoziomowe-mega-menu-w-motywie-dxpr'
      description: 'Motyw DXPR buduje swoje mega menu na systemie menu samego Drupala. Strukturę tworzysz w Struktura › Menu; motyw zamienia ją w menu rozwijane, które dzielą się na kolumny wraz ze wzrostem, zagnieżdżają się na trzy poziomy, otwierają po najechaniu lub kliknięciu i zwijają się w menu hamburger na telefonach. Bez modułu mega menu, bez dodatkowej konfiguracji; te same odnośniki obsługują komputer i telefon.'
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: 'Strona Główna'
            item: 'https://dxpr.com/pl'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: pl
---
[Centrum pomocy](/pl/hc)/[Dokumentacja](/pl/hc/dokumentacja) /[Poznaj DXPR Theme](/pl/hc/documentation/learn-dxpr-theme) /[Motywy bez kodowania](/pl/hc/documentation/learn-dxpr-theme/low-code-theme-customization) # Responsywne wielopoziomowe mega menu w motywie DXPR.

 Poznaj DXPR ThemeMotywy bez kodowania

   ## W tym przewodniku

Motyw DXPR buduje swoje mega menu na systemie menu samego Drupala. Strukturę tworzysz w *Struktura › Menu*; motyw zamienia ją w menu rozwijane, które dzielą się na kolumny wraz ze wzrostem, zagnieżdżają się na trzy poziomy, otwierają po najechaniu lub kliknięciu i zwijają się w menu hamburger na telefonach. Bez modułu mega menu, bez dodatkowej konfiguracji; te same odnośniki obsługują komputer i telefon.

Ten przewodnik obejmuje DXPR Theme 8.2.1 lub nowszy na Drupalu 10.3 i Drupalu 11. Zrzuty ekranu pochodzą z witryny na Drupalu 11.4 z DXPR Theme 8.2.2 i przykładowym trójpoziomowym menu; wykonano je w październiku 2026.

## Jak zachowuje się menu

- **Menu rozwijane z wcięć.** Każdy odnośnik menu z dziećmi staje się menu rozwijanym. Rodzic z własną stroną dostaje podzieloną kontrolkę: odnośnik prowadzi do strony, a strzałka obok otwiera menu rozwijane. Rodzic bez strony otwiera menu rozwijane jednym kliknięciem.
- **Kolumny z liczby odnośników.** Menu rozwijane z co najmniej 8 bezpośrednimi dziećmi dzieli się na 2 kolumny, z co najmniej 15 na 3, z co najmniej 21 na 4, a z co najmniej 28 na 5. Od 3 kolumn menu rozwijane rozciąga się na pełną szerokość nagłówka: to układ mega menu.
- **Trzy poziomy.** Odnośnik w menu rozwijanym może mieć własne dzieci. Rozwijają się wewnątrz menu, z wcięciem pod rodzicem, więc struktura Usługi › Badania › Laboratoria działa bez spłaszczania.
- **Najechanie albo kliknięcie.** Na komputerze z myszą menu rozwijane otwierają się po najechaniu i zawsze po kliknięciu. Gdy którekolwiek menu w całym menu ma trzeci poziom, każde menu przełącza się na obsługę wyłącznie klikiem, aby podmenu nie zamykało się, gdy wskaźnik do niego wędruje. Ekrany dotykowe i okna węższe niż 992 piksele zawsze używają kliku.
- **Klawiatura i czytniki ekranu.** Klawisze strzałek, Enter, spacja, Escape i Tab poruszają się po menu, a przełączniki pokazują swój stan za pomocą `aria-expanded`; zgodnie ze wzorcem nawigacji ujawnianej WAI.
- **Języki pisane od prawej do lewej** dostają odbite menu rozwijane i podmenu.
- **Telefony i tablety.** Poniżej mobilnego breakpointu, domyślnie 1200 pikseli, nagłówek pokazuje ikonę hamburgera. Otwiera ona menu nad stroną, a strzałka obok każdego rodzica rozwija jego dzieci w miejscu: na drugim poziomie tak samo jak na pierwszym.

## 1. Utwórz strukturę

1. Przejdź do *Struktura › Menu › Nawigacja główna* (`/admin/structure/menu/manage/main`).
2. Dodaj potrzebne odnośniki przyciskiem *Dodaj odnośnik*. Dla rodzica bez własnej strony wpisz `<button>` (natywny przycisk klawiatury) albo `<nolink>` jako odnośnik; oba otwierają menu rozwijane.
3. Przeciągnij dzieci pod rodzica, aby wcięły się o jeden poziom (trzeci poziom jeszcze o jeden), a potem naciśnij **Zapisz**.
4. Edytuj każdy odnośnik rodzica, zaznacz *Pokaż jako rozwinięte* i naciśnij **Zapisz**. Aby rozwinąć wszystkich rodziców naraz, zaznacz *Rozwiń wszystkie odnośniki menu* w ustawieniach bloku menu głównego.

To cała konfiguracja. Trzy poziomy to maksimum renderowane przez menu rozwijane; głębsze odnośniki należą do strony, nie do menu.

Strona administracji menu: dzieci wcięte pod rodzicem, trzeci poziom pod drugim.

Odnośnik rodzica bez *Pokaż jako rozwinięte* renderuje się bez dzieci, z wyjątkiem własnej strony.

## 2. Sprawdź menu na komputerze

Otwórz witrynę i najedź na strzałkę obok odnośnika rodzica albo ją kliknij; rodzic bez strony też otwiera się po kliknięciu. Gdy menu ma trzeci poziom, menu rozwijane otwierają się tylko po kliknięciu. Krótka lista otwiera się jako jednokolumnowe menu; długa rozkłada się na kolumny, a od 3 kolumn na pełną szerokość nagłówka. Kolejność wynika z wag odnośników na stronie administracji menu, kolumna po kolumnie.

Menu Usługi na komputerze, z rozwiniętym trzecim poziomem.

## 3. Sprawdź menu na telefonie

Zwęź przeglądarkę poniżej mobilnego breakpointu albo otwórz witrynę na telefonie. Ikona hamburgera otwiera menu nad stroną. Stuknij strzałkę obok rodzica, aby rozwinąć jego dzieci w miejscu, oraz strzałkę obok odnośnika drugiego poziomu, aby rozwinąć trzeci poziom. Nic do konfigurowania: to to samo menu.

Menu mobilne z rozwiniętymi Usługami; strzałka obok Badań otwiera trzeci poziom.

## 4. Nadaj styl nagłówkowi i menu

Wszystko, co dotyczy wyglądu, znajdziesz na karcie *Nagłówek i menu główne* w ustawieniach motywu (*Wygląd*, potem *Ustawienia* obok DXPR Theme albo twojego podmotywu). Strona ustawień pokazuje podgląd na żywo podczas zmian.

- **Układ**: siedem układów nagłówka, od *Normalny (logo po lewej, menu po prawej)* przez wyśrodkowane warianty jedne pod drugimi i w wierszu, po *Logo po prawej, menu po lewej*.
- **Styl nagłówka**: *Normalny*, albo *Nakładka*, aby położyć nagłówek na treści strony z przezroczystym tłem, oraz krycie nagłówka, wysokość i wysokość logo. **Stała pozycja** trzyma nagłówek w widoku podczas przewijania; po jej włączeniu **Przyklejony nagłówek** przełącza nagłówek na mniejszą wysokość i własne krycie po przewinięciu.
- **Odnośniki menu głównego**: *Szerokość menu rozwijanego* (automatyczna albo stała od 100 do 500 pikseli), *Styl czcionki* (normalny, kapitaliki, pogrubienie albo lead), *Odstępy odnośników* oraz *Styl hover* w postaci krycia, kolorowego tła, kolorowego tekstu albo obramowania (u góry lub u dołu, wsuwanego z lewej, z prawej, ze środka albo pojawiającego się z góry).
- **Nagłówek mobilny** i **Opcje menu mobilnego**: mobilny breakpoint (ustaw maksymalny, 4100, aby zawsze używać nagłówka mobilnego), wysokość i pozycję nagłówka mobilnego, ikonę hamburgera (trzy albo dwie linie), jej animację i wyrównanie menu.
- **Własne kolory nagłówka**: szesnaście kolorów do wyboru: tło i tekst paska nawigacji, bloków nagłówka, menu, menu rozwijanych i menu mobilnego oraz tło i tekst hover dla 3 ostatnich; każdy z palety motywu albo własny.

„Każda zmiana to ustawienie, nie CSS, więc przetrwa aktualizacje motywu. Podmotyw ma własne ustawienia, więc wprowadzaj te zmiany na stronie ustawień podmotywu.”

## Z modułu The Better Mega Menu albo innego modułu menu

Odinstaluj moduł i umieść blok podstawowy *Nawigacja główna* w regionie motywu „*Nawigacja (zwijana)*”, jeśli go tam jeszcze nie ma; to region, w którym menu hamburger zwija się na małych ekranach. Wszystko, co moduł robił konfiguracją, DXPR Theme robi strukturą menu: kolumny, poziomy, hover i menu mobilne. Nie przenosi się treści w menu rozwijanym, takich jak obrazy czy bloki tekstowe; umieść je na stronach docelowych, do których prowadzą odnośniki menu.

## Zleć budowę menu agentowi AI

Menu to lista odnośników z hierarchią: strukturalne zadanie, w którym agent kodujący sprawdza się dobrze. Z zainstalowanym [skillem Drush Webmaster](/pl/drupal-agent-skills) (`drush wm:setup-ai`), agent tworzy i porządkuje odnośniki menu na podstawie briefu, takiego jak „menu Usługi z Badaniami, Nauczaniem i Infrastrukturą oraz trzema laboratoriami w Badaniach”. Ze skillem DXPR Theme (`drush dxt:setup-ai`) ustawia też układ nagłówka, przyklejanie i kolory menu pod markę. Wynik przeglądasz w witrynie.

## Pytania o mega menu w DXPR Theme

### Czy z DXPR Theme potrzebuję modułu mega menu?

Nie. Kolumny, trzy poziomy, hover i klik, obsługa klawiatury i menu mobilne pochodzą z motywu. Wystarczy zagnieżdżone menu z *Pokaż jako rozwinięte* u rodziców albo *Rozwiń wszystkie odnośniki menu* w bloku menu.

### Dlaczego moje menu otwiera się tylko po kliknięciu?

Bo gdzieś w menu jakieś menu rozwijane ma trzeci poziom. Motyw przełącza wtedy całe menu na obsługę wyłącznie klikiem, aby podmenu nie zamykało się, gdy wskaźnik do niego wędruje. Spłaszcz strukturę do dwóch poziomów, aby hover działał wszędzie. Ekrany dotykowe i okna węższe niż 992 piksele zawsze używają kliku.

### Jak uzyskać mega menu na pełną szerokość?

Daj menu rozwijanemu co najmniej 15 bezpośrednich dzieci. Od 3 kolumn rozciąga się na pełną szerokość nagłówka. Przy 8–14 dzieciach dostajesz dwie kolumny pod odnośnikiem rodzica; mniej zostaje jedną kolumną.

### Czy odnośnik rodzica otworzy menu, nie prowadząc donikąd?

Tak. Podczas edycji elementu menu wpisz `<nolink>` albo `<button>` jako odnośnik; oba są wbudowane w jądro Drupala. Rodzic przełącza wtedy swoje menu i nie ma własnej strony.