Menu WordPress – jak stworzyc profesjonalna nawigacje na stronie

Klasyczny edytor menu jest dostepny w kazdym motywie WordPress. Dziala sprawdznie od lat i nie wymaga zadnej wiedzy technicznej. Oto co musisz zrobic:

Krok 1 – Utworz nowe menu. Przejdz do Wyglad > Menu, wpisz nazwe (np. "Menu glowne") i kliknij "Utworz menu".

Krok 2 – Dodaj elementy. Po lewej stronie widzisz dostepne zrodla: Strony, Wpisy, Wlasne odnosniki, Kategorie. Zaznacz co Cie interesuje i kliknij "Dodaj do menu".

Krok 3 – Ustal kolejnosc. Przeciagasz elementy gora-dol. Przesuniecie w prawo tworzy podmenu – i tak wlasnie powstaje menu rozwijane w WordPress.

Krok 4 – Przypisz lokalizacje. Na dole strony w sekcji "Pozycje menu" zaznacz, gdzie menu ma sie wyswietlac. Nazwy lokalizacji zaleza od motywu – typowe to Primary Menu, Footer Menu, Mobile Menu.

Krok 5 – Opcje zaawansowane. Kliknij "Opcje ekranu" w prawym gornym rogu i wlacz: Cel odnosnika (otwieranie w nowej karcie), Klasy CSS (wlasne style), Opis (dodatkowy tekst pod linkiem).

Ta metoda wciaz swietnnie sprawdza sie w motywach klasycznych – Astra, GeneratePress, OceanWP czy motywy premium. Jest uniwersalna i intuicyjna.

Nie chcesz ryzykować problemów? Powierz to naszym realizację strony internetowej.

WordPress 6.x wprowadzil zupelnie nowy sposob zarzadzania nawigacja – blok Nawigacja (Navigation Block) w ramach Full Site Editing. Jesli uzywasz motywu blokowego (Twenty Twenty-Four, Flavor, Flavor Light), to jest Twoja glowna metoda.

Gdzie znajdziesz edytor: Wyglad > Edytor (uwaga – nie "Menu"!). Klikasz na menu w naglowku i edytujesz je bezposrednio w wizualnym edytorze.

Jak dodac elementy: Kliknij "+" w bloku nawigacji, dodaj odniesnik do strony, wpisu, kategorii lub wlasnego URL. Mozesz zagniezdac bloki, tworzac podmenu.

Roznica miedzy blokiem Nawigacja a klasycznym edytorem jest fundamentalna. Blokowy edytor pozwala na edycje WYSIWYG – widzisz efekt od razu. Mozesz dodawac ikony, przyciski i linki do social media bezposrednio w nawigacji. Z drugiej strony – interfejs bywa nieintuicyjny, szczegolnie przy tworzeniu podmenu. Kluczowa zasada: motyw blokowy = Blok Nawigacja, motyw klasyczny = Wyglad > Menu.

Wiecej o edytorze blokowym znajdziesz w naszym poradniku Gutenberga.

Proste menu rozwijane (dropdown) tworzysz bez wtyczek – wystarczy przeciagnac element w prawo. Ale co, jesli potrzebujesz nawigacji z kolumnami, obrazkami i widgetami?

Max Mega Menu to najpopularniejsza wtyczka do mega menu z ponad 400 000 instalacji. Konfiguracja jest prosta:

1. Zainstaluj i aktywuj Max Mega Menu
2. Wyglad > Max Mega Menu > Wlacz dla wybranej lokalizacji
3. Wejdz w Wyglad > Menu i przy elemencie kliknij "Mega Menu"
4. Wybierz uklad: siatka kolumn, widgety, ikony

Max Mega Menu pozwala budowac menu wielokolumnowe (np. 3 kolumny uslug z ikonkami), wstawiac widgety w dropdown, ustawiac animacje otwarcia (fade, slide) i flyout submenu.

Alternatywy: UberMenu (premium, 29 USD) i wbudowany mega menu w Elementor Pro – jesli juz uzywasz Elementora, masz mega menu w zestawie.

Kiedy mega menu ma sens? Sklep z wieloma kategoriami, portal z rozbudowana struktura, strona korporacyjna. Dla prostej strony firmowej z 5–10 podstronami – mega menu to przerost formy. Lepsze jest czytelne menu z jednym poziomem podmenu.

Potrzebujesz profesjonalnej strony WordPress z dopracowana nawigacja? Sprawdz nasza oferte lub napisz do nas.

Ponad 60% ruchu na polskich stronach pochodzi z urzadzen mobilnych. Menu, ktore wyglada swietnie na desktopie, na telefonie moze byc katastrofa.

Wiekszosc wspolczesnych motywow automatycznie zamienia nawigacje na "hamburger" (trzy poziome kreski) na ekranach ponizej 768px. Po kliknieciu menu rozwija sie jako panel boczny lub dropdown.

Niektore motywy (Astra Pro, GeneratePress Premium) pozwalaja przypisac osobne menu dla mobile. To przydatne – na telefonie potrzebujesz mniej elementow. Telefon, Oferta, Kontakt – czesto tyle wystarczy.

Jesli Twoj motyw nie radzi sobie z nawigacja mobilna, zainstaluj wtyczke Responsive Menu – konfigurujesz styl (slide, push, overlay), animacje i breakpoint.

Typowe problemy z menu mobilnym:
- Za duzo elementow – skroc do 5–6 pozycji
- Tekst za maly do klikniecia – minimum 44px wysokosci elementu (wytyczne WCAG)
- Podmenu nie otwiera sie – sprawdz konflikt z wtyczkami cache lub JavaScript

Testuj menu na prawdziwym telefonie, nie tylko w inspektorze przegladarki. Roznice w zachowaniu dotykowym bywaja zaskakujace.

Menu nawigacyjne to nie tylko element UX – ma tez bezposredni wplyw na pozycjonowanie Twojej strony WordPress.

Jak Google interpretuje menu

Robot Google traktuje linki w nawigacji jako silne sygnaly waznosci. Strona, ktora jest w menu glownym, dostaje wiecej link equity niz strona ukryta gleboko w strukturze. Dlatego w menu powinny znalezc sie najwazniejsze podstrony.

Praktyczne wskazowki SEO:
- Uzywaj opisowych anchor textow ("Uslugi SEO" zamiast "Oferta")
- Nie umieszczaj wiecej niz 7 elementow glownych – zbyt wiele linkow rozprasza link equity
- Najwazniejsze strony daj na pierwszym poziomie, reszta w podmenu
- Unikaj menu opartego wylacznie na JavaScript – Google moze go nie wyrenderowac

Dostepnosc ARIA i nawigacja klawiatura

Od 2025 roku w UE obowiazuje European Accessibility Act. WordPress 6.x dodaje role="navigation" do kontenera menu i podstawowe atrybuty ARIA. Ale warto sprawdzic recznie:

1. Czy mozesz przejsc przez cale menu klawiszem Tab?
2. Czy podmenu otwiera sie Enterem/Spacja?
3. Czy Escape zamyka otwarte podmenu?
4. Czy fokus jest widoczny (obramowanie lub podswietlenie)?
5. Czy kontrast tekstu do tla wynosi minimum 4.5:1?

Narzedzia do testowania: WAVE (wave.webaim.org), aXe DevTools i – po prostu – klawiatura. Sprobuj uzyc strony bez myszy. To najlepszy test dostepnosci, jaki mozesz zrobic.

Wiecej o wydajnosci WordPress i Core Web Vitals znajdziesz w osobnym poradniku.

Menu nie wyswietla sie po zmianie motywu. Nowy motyw ma inne lokalizacje menu – przejdz do Wyglad > Menu i przypisz istniejace menu do nowej lokalizacji.

Kolejnosc elementow sie zmienia. Najczesciej problem z cache przegladarki lub wtyczka cache (WP Rocket, LiteSpeed Cache). Wyczysc cache i sprawdz ponownie.

Podmenu nie otwiera sie na mobile. Konflikt JavaScript – najczesciej miedzy motywem a wtyczka (np. Elementor lub slider). Wylacz wtyczki po kolei, zeby znalezc zrodlo problemu.

Menu jest zbyt wolne (mega menu). Mega menu z wieloma elementami moze wplywac na Core Web Vitals, szczegolnie CLS (Cumulative Layout Shift). Rozwazan lazy loading podmenu lub ograniczenie liczby elementow.