W tym poradniku chcielibyśmy skupić się na temacie dodawania i edytowania paska menu na naszej stronie. Jeżeli korzystać z Wordpressa, obsługa menu jest banalnie prosta. Pokażemy też, jak rozbudować możliwości naszego menu z podstronami i linkami.

Pasek menu na naszej stronie pozwala na szybki dostęp do wszystkich podstron dostępnych na witrynie - a więc np. kontaktu, bloga, informacji o firmie itp. To bardzo ważny element ułatwiający internautom dostęp do najważniejszych wiadomości, jakie chcą zdobyć. Dlatego też zwykle pasek menu znajduje się w górnej części strony głównej naszej witryny.

Istnieje sporo sposobów na zarządzanie menu z poziomu Wordpress. Możemy skorzystać z domyślnych ustawień, które sprawdzają się idealnie w przypadku niezbyt skomplikowanych witryn. Dla bardziej wymagających użytkowników przeznaczono wtyczki, dzięki którym można spersonalizować wygląd i zachowanie paska menu. Ten temat również omówimy w tym poradniku.

Domyślne menu Wordpress i ustawianie kolejności stron

Zacznijmy od najprostszej metody, czyli wbudowanego w Wordpressa paska menu. Kiedy zalogujemy się do naszego panelu zarządzania Wordpressem, będzie on dostępny z poziomu zakładki Wygląd > Menu. W głównej części okna wpisujemy nazwę menu (tylko na nasze wewnętrzne potrzeby), a następnie klikamy przycisk "Utwórz menu".

Następnie przechodzimy do lewej części okna, gdzie mamy wyszczególnione kategorie elementów, które można dodać do menu - strony, wpisy, własne odnośniki (czyli linki do innych stron), a także Kategorie. Wystarczy rozwinąć daną zakładkę, następnie zaznaczyć strony czy wpisy, które chcemy dodać do menu, a dalej - kliknąć przycisk "Dodaj do menu".

Strona pojawi się teraz w sekcji naszego nowego menu. Możemy dodawać kolejne strony i porządkować je, przesuwając prostokąty w dowolnej kolejności. Możemy też tworzyć submenu, czyli w ramach jednej zakłądki menu dodawać kilka stron.

Nie zawsze jednak menu będzie wyświetlać się prawidłowo. W przypadku statycznych stron dobrze jest przejsć w lewym pasku menu do zakładki Strony, a następnie wejść w edycję strony. Tutaj, po otwarciu edycji, w prawej części okna, w sekcji "Atrybuty strony" możemy ustawić "rodzica", czyli stronę nadrzędną, a także kolejność. Według numeracji, którą nadamy, będą wyświetlać się strony w naszym pasku menu.

Wtyczki - Mega Menu

Jeżeli jednak zależy nam na bardziej rozbudowanym pasku menu czy też większej liczbie funkcji, należy skorzystać z zewnętrznej wtyczki. Na początek przetestujmy popularną wtyczkę Mega Menu. Rozszerzenie po zainstalowaniu i aktywowaniu dostępne jest w lewym pasku menu, z poziomu zakładki WR Megamenu.

Przechodzimy do zakładki WR MegaMenu > Add New i dodajemy nowe menu do naszej witryny czy bloga. Następnie wprowadzamy tytuł dla naszego paska menu i lokalizację - tutaj trzeba podać miejsce, które zajmuje obecnie domyślne, standardowe menu dodane z poziomu Wordpressa. To ważny element, bowiem bez niego wtyczka nie będzie mogła prawidłowo działać.

Za pomocą prostego edytora, jaki udostępnia wtyczka, możemy dodawać kolejne sekcje, podstrony, separatory czy nawet kolumny. W ten sposób można stworzyć bardzo rozbudowane paski menu z wieloma pozycjami, a nawet miniaturkami zdjęć lub ikonami wewnątrz widoku menu.

Z poziomu edycji wyglądu, Mega Menu pozwala teżna ustawienie tła dla naszego menu (po jego rozwinięciu), krawędzi i marginesów, a także na dodanie własnych CSS-ów. Z kolei pod przyciskiem "Styling" ukrywają się narzędzia ze schematami kolorów do wykorzystania, układem wertykalnym bądź horyzontalnym menu, a także możliwością ustawienia osobnych fontów dla naszego menu. Na koniec należy oczywiście opublikować stworzone wcześniej menu.

Wtyczki - Max Mega Menu

Bardzo podobna z nazwy wtyczka Max Mega Menu oferuje nieco inne funkcje do tworzenia i zarządzania naszym paskie menu. Rozszerzenie będzie dostępne w lewym pasku menu po zainstalowaniu, w zakładce Mega Menu.

Mamy tutaj ogólne ustawienia dla wtyczki, które pozwalają na wprowadzenie takich zmian jak chociażby zachowanie wtyczki po kliknięciu czy wersja dla urządzeń mobilnych. W zakładce Menu Themes znajdziemy motywy, które pozwolą nam na zmianę i dostosowanie wyglądu naszej wtyczki do naszych zapotrzebowań. Dostępne są też tutaj inne elementy personalizacji jak chociażby cienie, kształt strzałek, marginesy, wielkość odstępów, linie poziome, fonty itp. Liczba możliwości zmiany wyglądu naszego menu jest bardzo duża.

Bardzo ważnym elementem jest zakładka Menu Locations, z poziomu której ustalamy, w jakim miejscu na naszej stronie czy blogu ma znajdować się stworzony za pomocą Max Mege Menu pasek menu. Podobnie jak w przypadku wcześniejszej wtyczki chodzi tutaj o zastąpienie domyślnego menu z Wordpressa tym, które stworzyliśmy za pomocą wtyczki.

Ciekawym rozwiązaniem jest też zakładka Tools, z poziomu której możemy eksportować ustawienia naszego paska menu i w ten sposób stworzyć jego kopię bezpieczeństwa. Można też z jej poziomu wyczyścić dotychczasowe ustawienia wtyczki Max Mega Menu i przywrócić domyślne. A także oczywiście zaimportować ustawienia ze stworzonej wcześniej kopii bezpieczeństwa.

Wtyczka - JQuery Mega Menu Widget

To rozwiązanie przyda się, jeżeli zależy nam na wprowadzeniu tzw. menu drop down, czyli rozbudowanego paska menu z licznymi rozwijanymi zakładkami. Idealnie sprawdza się do prowadzenia sklepu czy strony z bogatą ofertą produktów. Każda z rozwijanych zakładek w pasku menu może być podzielona na kilka komórek z odnośnikami wewnątrz. Do tego komórki czy zakładki mogą mieć wyróżniające je grafiki, nazwy i ikony.

Po zainstalowaniu wtyczki, jest ona dostępna z poziomu lewego paska menu, gdzie też możemy wprowadzić interesująće nas zmiany. Interfejs wtyczki jest bardzo zbliżony do domyślnego narzędzia tworzenia menu w Wordpressie. A zatem, ustawiamy bloki z odnośnikami i zakładkami, porządkujemy je metodą przenieś i upuść. Możemy też dodawać efekty takie jak efekty przejścia, szybkość animacji itp.

Dostępnych jest kilka skórek umożliwiających zmianę ogólnego wyglądu naszego menu. Wtyczka sprawdza się bardzo dobrze w przypadku stron z dużą liczbą odnośników, które chcielibyśmy umieścić w menu.

Na koniec zachęcamy oczywiście do komentowania tego poradnika i dodawania własnych wtyczek, z których korzystacie. Piszcie też, jeżeli macie problemy z obsługą menu na swojej stronie działającej w opraciu o Wordpressa. Postaramy się pomóc każdemu indywidualnie i podsunąć najlepsze rozwiązania.