Jak utworzyć menu rozwijane w WordPress (przewodnik dla początkujących)

Czy chcesz stworzyć menu rozwijane i dodać je do swojej witryny WordPress??


Rozwijane menu pokazuje listę łączy po najechaniu myszką na element w menu.

Używamy menu rozwijanego na WPBeginner, śmiało i najedź myszką na menu nawigacyjne na górze.

W tym przewodniku dla początkujących pokażemy, jak łatwo utworzyć menu rozwijane w WordPressie wraz z instrukcjami krok po kroku.

Tworzenie menu rozwijanego w WordPress

Dlaczego warto korzystać z menu rozwijanych w WordPress?

WordPress jest wyposażony we wbudowany system zarządzania menu, który umożliwia łatwe dodawanie menu nawigacyjnych do witryny WordPress.

Menu nawigacyjne to linki do stron głównych Twojej witryny, które zwykle pojawiają się na górze jako poziomy rząd obok logo witryny.

Typowe menu nawigacyjne z poziomym rzędem linków

Jeśli zaczynasz blog lub tworzysz witrynę z zaledwie kilkoma stronami, możesz dodać je w jednym rzędzie.

Jeśli jednak prowadzisz sklep internetowy lub dużą witrynę internetową, możesz dodać więcej linków do menu nawigacji.

Menu rozwijane pomagają rozwiązać problem ograniczonej przestrzeni, wyświetlając łącza menu tylko wtedy, gdy użytkownik umieści kursor myszy na elemencie nadrzędnym. Pozwalają również organizować strukturę menu według tematów lub hierarchii.

Przykład menu rozwijanego

Na koniec też wyglądają całkiem nieźle.

To powiedziawszy, teraz rzućmy okiem na to, jak możesz łatwo tworzyć menu rozwijane WordPress i dodawać je do swojej witryny.

Film instruktażowy

Subskrybuj WPBeginner

Jeśli film Ci się nie podoba lub potrzebujesz więcej instrukcji, czytaj dalej.

Krok 1. Wybór motywu z obsługą menu rozwijanego

WordPress ma wbudowany system zarządzania menu, ale wyświetlanie tych menu jest całkowicie zależne od motywu WordPress.

Prawie wszystkie motywy WordPress domyślnie obsługują menu rozwijane. Jednak niektóre motywy mogą nie mieć odpowiedniego wsparcia menu.

Musisz upewnić się, że używasz motywu WordPress, który obsługuje menu rozwijane.

Skąd wiesz, czy motyw, którego używasz, obsługuje menu rozwijane?

Możesz po prostu odwiedzić stronę motywu, w której znajdziesz link do wersji demonstracyjnej motywu. Stamtąd możesz sprawdzić, czy wersja demonstracyjna pokazuje menu rozwijane w menu nawigacyjnym.

Jeśli nie jest, musisz znaleźć motyw WordPress.

Zobacz nasz przewodnik na temat wyboru idealnego motywu WordPress dla swojej witryny.

Oto kilka doskonałych motywów, które obsługują menu rozwijane po wyjęciu z pudełka.

  • Astra – jest to uniwersalny motyw WordPress, który zawiera kilka stron startowych i mnóstwo funkcji.
  • Motywy StudioPress – te profesjonalne motywy, oparte na strukturze motywów genesis, są wysoce zoptymalizowane pod kątem wydajności.
  • OceanWP – popularny motyw WordPress odpowiedni dla wszystkich rodzajów stron internetowych.
  • Ultra – Powered by Themify builder Ten motyw przeciągnij i upuść WordPress ma piękne szablony i elastyczne opcje motywu.
  • Divi – popularny motyw od Elegant Themes, który korzysta z narzędzia do tworzenia stron Divi i oferuje mnóstwo przeciągania & upuszczaj funkcje, w tym menu rozwijane.

To powiedziawszy, spójrzmy teraz, jak stworzyć rozwijane menu WordPress.

Krok 1. Tworzenie menu nawigacyjnego w WordPress

Jeśli masz już skonfigurowane menu nawigacji w swojej witrynie, możesz przejść do następnego kroku.

Najpierw utwórzmy proste menu.

Iść do Wygląd »Menu i kliknij link „Utwórz nowe menu” u góry.

Utwórz menu

Następnie musisz podać nazwę menu nawigacyjnego. Ta nazwa nie będzie publicznie widoczna w Twojej witrynie. Celem nazwy menu jest pomoc w identyfikacji menu w obszarze administracyjnym WordPress.

Nazwa menu

Wpisz nazwę swojego menu, a następnie kliknij przycisk „Utwórz menu”.

WordPress utworzy teraz dla ciebie nowe puste menu.

Dodajmy górne linki do menu nawigacji. Te elementy pojawią się w górnym wierszu menu.

Po prostu wybierz strony, które chcesz dodać z lewej kolumny i kliknij przycisk „Dodaj do menu”. Możesz także wybrać posty na blogu, kategorie lub dodać niestandardowe linki.

Dodaj strony do menu

Zobaczysz te strony w prawej kolumnie pod nowym menu.

Krok 2. Dodawanie podelementów do menu

Elementy podrzędne to elementy, które pojawią się w menu rozwijanym. W zależności od tego, jak chcesz uporządkować menu, możesz dodać je pod dowolnym z istniejących elementów.

Na potrzeby tego samouczka dodamy kategorie pod linkiem do bloga.

Po prostu wybierz elementy, które chcesz dodać z lewej kolumny, a następnie kliknij przycisk „Dodaj do menu”. Twoje elementy pojawią się teraz w prawej kolumnie.

Nowe pozycje menu dodane do menu

Linki te pojawią się jednak jako zwykłe elementy. Musimy uczynić je podelementem menu nadrzędnego.

Możesz po prostu przeciągnąć i upuścić element menu i umieścić go pod elementem nadrzędnym. Przesuń go lekko w prawo, a stanie się podelementem.

Dodanie elementów podmenu, aby utworzyć menu rozwijane

Powtórz proces dla wszystkich linków, które chcesz wyświetlić w menu rozwijanym.

Po zakończeniu nie zapomnij kliknąć przycisku „Zapisz menu”, aby zapisać zmiany.

Krok 3. Opublikuj menu rozwijane

Jeśli edytujesz menu, które jest już w Twojej witrynie, zacznie się ono od razu pojawiać w Twojej witrynie.

Jeśli jednak jest to nowy element menu, musisz teraz wybrać lokalizację motywu, aby wyświetlić to menu.

Motywy WordPress mogą wyświetlać menu w różnych lokalizacjach. Każdy motyw określa własne lokalizacje menu i możesz wybrać menu, które chcesz tam wyświetlić.

Znajdziesz tę opcję w prawej kolumnie w „Ustawieniach menu”. Wybierz opcję obok ustawienia „Wyświetl lokalizację” i kliknij przycisk „Zapisz menu”.

Wybierz lokalizację motywu

Możesz teraz odwiedzić swoją stronę internetową, aby zobaczyć menu rozwijane w akcji.

Podgląd menu rozwijanego

Wskazówki dotyczące tworzenia interaktywnych menu rozwijanych

Menu nawigacyjne są ważne, ponieważ jest to pierwsze miejsce, w którym użytkownicy będą szukać, jeśli chcą zobaczyć określone informacje.

Prawidłowe ich użycie pomoże użytkownikom znaleźć drogę do Twojej witryny. Pomoże Ci również uzyskać więcej odsłon, konwersji i sprzedaży w Twojej witrynie.

Oto kilka wskazówek na temat zwiększania interaktywności menu nawigacyjnych za pomocą menu rozwijanych.

1. Możesz tworzyć wielopoziomowe menu rozwijane

Utworzenie linku jako podpozycji innego linku powoduje, że pojawia się on w menu rozwijanym. Możesz również dodać element podrzędny pod innym elementem, aby utworzyć wielopoziomowe menu rozwijane.

Menu wielopoziomowe

Twój motyw automatycznie wyświetli je jako podmenu w menu rozwijanym.

Wielopoziomowe menu rozwijane

2. Możesz także utworzyć wiele menu rozwijanych

Możesz utworzyć menu rozwijane pod dowolnym górnym linkiem w menu. Możesz nawet dodać wiele menu rozwijanych w głównym menu nawigacyjnym.

Wiele menu rozwijanych w menu głównym

3. Utwórz menu z podglądem na żywo

Jeśli menu stanie się zbyt skomplikowane, możesz przełączyć się na podgląd wizualny. Iść do Wygląd »Dostosuj aby uruchomić dostosowywanie motywu na żywo.

Stamtąd kliknij kartę „Menu”, a następnie wybierz menu nawigacji. Zobaczysz teraz edytor menu przeciągnij i upuść w lewej kolumnie z podglądem na żywo witryny w prawym panelu.

Dostosuj menu WordPress za pomocą podglądu na żywo

4. Tworzenie dużego mega menu jako menu rozwijanego w WordPress

Menu rozwijane pokazują tylko jedno menu na raz. Co jeśli chcesz pokazać pełną strukturę swojej witryny jako mega menu, które pojawia się tylko wtedy, gdy użytkownik umieści kursor w menu głównym?

Przykład mega menu

Mega menu pojawiają się jako menu rozwijane, ale mogą wyświetlać o wiele więcej linków, podmenu i więcej. Aby uzyskać szczegółowe instrukcje, zobacz nasz samouczek krok po kroku, jak utworzyć mega menu w WordPress.

Mamy nadzieję, że ten artykuł pomógł ci nauczyć się, jak łatwo tworzyć menu rozwijane w WordPress. Możesz także zapoznać się z naszym przewodnikiem, jak utworzyć lepkie pływające menu nawigacyjne w WordPress i jak dodawać ikony obrazów do menu nawigacyjnych w WordPress.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map