Jak stworzyć dynamiczne menu w WordPress

WordPress to system zarządzania treścią (CMS), który umożliwia stworzenie strony internetowej lub bloga od podstaw lub ulepszenie istniejącej strony internetowej. W tym artykule pokażemy, jak stworzyć dynamiczne menu w WordPressie. Menu dynamiczne to menu, które zmienia się w zależności od oglądanej strony. Na przykład, jeśli przeglądasz stronę o „Motywach WordPress”, menu pokaże linki do innych stron o motywach WordPress. Jeśli przeglądasz stronę o „Wtyczkach WordPress”, menu pokaże linki do innych stron o wtyczkach WordPress. Tworzenie dynamicznego menu w WordPressie jest łatwe. Najpierw musisz stworzyć menu. Po drugie, musisz dodać pozycje do menu. Po trzecie, musisz przypisać menu do lokalizacji. Po czwarte, musisz dodać kod do swojego motywu WordPress. Zacznijmy od pierwszego kroku: stworzenia menu.

W drugiej części tej serii idziemy o krok dalej, tworząc dynamiczne menu nawigacyjne. Dowiesz się, jak budować menu warunkowe na podstawie ich lokalizacji w Widoczności bloku za pomocą dodatku Pro. Motyw blokowy służy do tworzenia części szablonu opartych na zasadach blokowych. Ten samouczek przeprowadzi Cię przez kroki wymagane do utworzenia dodatkowego menu nawigacyjnego na stronie „Wycieczki piesze”. Wystarczy kliknąć Edytor witryny, aby edytować nagłówek witryny. Korzystając z kontrolki Lokalizacja we wtyczce Block Visibility, możemy również ograniczyć lokalizację menu pomocniczego. W Bazie wiedzy wybierz opcję Lokalizacja, a następnie kliknij ikonę wielokropka, aby ją włączyć.

Możemy teraz ograniczyć widoczność bloku do strony Wycieczki piesze, używając kontroli lokalizacji, która pozwala na większą kontrolę nad widocznością. Reguła Post instruuje nas, abyśmy wybrali typ postu na stronie oraz typ strony „Wędrówka”. W wynikowej konfiguracji reguły należy przestrzegać następujących zasad. Na stronie głównej naszej witryny demonstracyjnej będziemy mogli uzyskać dostęp do zupełnie nowego menu warunkowego. Pozostała część tego artykułu ma zostać ukończona. Możesz to osiągnąć, używając różnych reguł i zestawów reguł. W tym demo wybraliśmy prosty przykład.

Aby utworzyć nowe menu, przejdź do Wygląd. Kliknij "Utwórz menu", jeśli chcesz utworzyć menu dodatkowe, "Moje menu niestandardowe", jeśli chcesz utworzyć niestandardowe menu dla określonej lokalizacji, i "Menu dodatkowe", jeśli chcesz utworzyć menu dodatkowe dla innej lokalizacji. Po dodaniu niektórych elementów do menu zapisz je (na przykład element menu 1, element menu 2 i element menu 3).

Jak utworzyć dynamiczne menu w niestandardowym motywie WordPress?

Jednym ze sposobów utworzenia dynamicznego menu w WordPressie jest użycie funkcji wp_nav_menu. Ta funkcja pozwoli Ci stworzyć menu, które jest automatycznie generowane na podstawie struktury Twojej witryny. Możesz również użyć tej funkcji, aby utworzyć niestandardowe menu, które jest specyficzne dla Twojego motywu.

Wykonując te kroki, możesz stworzyć proste i dynamiczne menu nawigacyjne w WordPress. Podstawowym krokiem jest zarejestrowanie menu nawigacyjnego za pomocą funkcji register_nav_menus(). Aby to uruchomić, musisz najpierw zarejestrować go w pliku functions.php w motywie potomnym, a następnie użyć haka „init”. W tym przykładzie skorzystamy z głównego menu nagłówka. Wtyczka Nav Menu jest dostępna na WordPress.org i umożliwia przypisanie różnych menu do różnych użytkowników w zależności od ich roli. Możemy również użyć tej wtyczki, aby zarejestrować wiele menu jednocześnie. W poprzednim kroku możemy stylizować menu nawigacyjne na podstawie projektu witryny, odwołując się do niestandardowych klas CSS w wywołaniu funkcji WP_nav_menu.

Jak stworzyć dynamiczne menu nagłówka w WordPress

Aby utworzyć dynamiczne menu nagłówka w WordPress, musisz najpierw utworzyć niestandardowe menu. Aby to zrobić, przejdź do sekcji Menu w panelu administracyjnym WordPressa i kliknij link Utwórz nowe menu. Wprowadź nazwę swojego menu i kliknij przycisk Utwórz menu. Następnie musisz dodać pozycje do swojego menu. Aby to zrobić, kliknij link Dodaj elementy i wybierz strony lub posty, które chcesz dodać do swojego menu. Po dodaniu wszystkich żądanych elementów kliknij przycisk menu Zapisz. Twoje dynamiczne menu nagłówka jest teraz gotowe do użycia.

Jeśli utworzymy dynamiczną stronę menu za pomocą metody WordPress Dynamic Menu Page Method, opisanej w dalszej części tego samouczka, będziemy mogli to zmienić. W nawigacji głównej obraz tła służy do zmiany pozycji pozycji menu na podstawie jej identyfikatora. Użycie tagu „span” pozwoli nam ukryć tekst, aby zobaczyć obraz tła tak, jak go widzimy. Kod, którego użyjemy, jest dynamicznie generowany przez WordPressa przy użyciu specjalnej klasy o nazwie current_page_ancestor, więc powinien wyglądać tak: Nic więcej nie zostało powiedziane. Jeśli chcemy zwiększyć ilość podstron, po prostu zwiększ lub zmniejsz ustawienie głębokość=2 tak, aby wyświetlało nieograniczoną liczbę stron. Korzystając z CSS, link do bieżącej strony, jak pokazano na poniższym obrazku, jest teraz bardzo prosty do wyświetlenia pogrubioną czcionką. Przejdź do strony nadrzędnej z podświetloną sekcją. Zaznacz stronę podrzędną rodzica.

WordPress dynamicznie dodawaj elementy menu

Dodawanie pozycji menu do menu WordPress można wykonać za pomocą pulpitu nawigacyjnego WordPress lub dodając kod do motywu. Jeśli chcesz dodać pozycję menu do istniejącego menu, po prostu zaloguj się do swojej witryny WordPress i przejdź do strony „Wygląd > Menu”. Stamtąd możesz dodawać nowe pozycje menu, wybierając je z lewej strony i klikając przycisk "Dodaj do menu". Jeśli chcesz dodać elementy menu za pomocą kodu, musisz dodać kilka wierszy kodu do pliku functions.php motywu. Pierwszą rzeczą, którą musisz zrobić, to utworzyć nową funkcję, która doda elementy menu. Ta funkcja może mieć dowolną nazwę, ale nazwiemy ją „moje_niestandardowe_menu_items()”. Wewnątrz tej funkcji musisz użyć haka filtra „wp_nav_menu_items” WordPress. Ten haczyk pozwala dodawać nowe pozycje do istniejącego menu. Kod wewnątrz funkcji będzie wyglądał mniej więcej tak: function my_custom_menu_items( $items, $args ) { // Zrób coś z $items return $items; } add_filter( 'wp_nav_menu_items', 'my_custom_menu_items', 10, 2 ); Powyższy kod doda nową funkcję, której można użyć do dodawania elementów do istniejącego menu. Sama funkcja jeszcze nic nie robi, ale zapewnia strukturę, której można użyć do dodania własnych niestandardowych elementów menu. Aby faktycznie dodać elementy menu, musisz zmodyfikować kod wewnątrz funkcji, aby dopasować go do swoich potrzeb. Na przykład, jeśli chcesz dodać link do swojej strony „O mnie”, użyj następującego kodu: function my_custom_menu_items( $items, $args ) { $items .= 'About'; zwróć $items; } add_filter( 'wp_nav_menu_items', 'my_custom_menu_items', 10, 2 ); Powyższy kod doda nowy link do Twojego menu z tekstem „O”. Możesz dodać dowolną liczbę elementów menu, dodając dodatkowe wiersze kodu wewnątrz funkcji.

Wtyczka dynamicznego menu WordPress

Wtyczka dynamicznego menu WordPress to świetny sposób na dodanie odrobiny pikanterii do nawigacji w witrynie. Umożliwiając tworzenie menu, które zmieniają się w zależności od tego, na co patrzą Twoi goście, możesz utrzymać ich zaangażowanie i wrócić po więcej.

Jak stworzyć niestandardowe menu w WordPress

Aby utworzyć niestandardowe menu w WordPress, musisz przejść do sekcji „Wygląd” na pulpicie nawigacyjnym i wybrać opcję „Menu”. Stamtąd możesz utworzyć nowe menu i dodać dowolne żądane strony, kategorie lub niestandardowe łącza. Po zapisaniu zmian możesz przypisać nowo utworzone menu do lokalizacji w swojej witrynie za pomocą zakładki „Zarządzaj lokalizacjami”.

Vegibit pozwala zrozumieć, jak stworzyć motyw WordPress. Menu będzie znajdować się pod nazwą witryny i obszarem sloganu, ale będzie wyżej w treści witryny. Aby menu się pojawiło, musimy najpierw zarejestrować lokalizację w pliku functions.php motywu. Stwórz nasze niestandardowe menu w panelu WordPress. Teraz konieczne jest zarejestrowanie naszego nowego menu w rdzeniu WordPress. Dzięki tej funkcji możemy teraz zarządzać lokalizacją pulpitu nawigacyjnego. Chcemy, aby wyglądało to tak, jakby pochodziło bezpośrednio z funkcji WordPress_nav_menu().

W kolejnym kroku połączymy się z całą listą kategorii. Możesz być w stanie osiągnąć efekt najechania, jeśli najedziesz myszą na każdy link. Aby zorientować się, jak to będzie działać, stworzyliśmy plik style.css. Chcemy usunąć podkreślenie linków i wypunktowania z każdego elementu na naszej liście, a także usunąć dopełnienie i margines z każdego elementu. W podsumowaniu WordPressa znajdziesz szczegółową procedurę tworzenia niestandardowego menu. To doskonałe wyjaśnienie, jak korzystać z niestandardowego menu w motywie WordPress. Nasze zadanie zostało ułatwione dzięki kilku funkcjom WordPress. Gdy nowe menu zostało połączone z WordPress, łatwo było dodać lub usunąć dowolny rodzaj treści z tego menu.

Tworzenie niestandardowego menu w WordPress

Po utworzeniu menu przejdź do Wygląd. Nowe menu będzie można zobaczyć na stronie menu. Gdy tylko go wybierzesz, możesz go dostosować według własnego uznania.