Jak zbudować składane menu paska bocznego w WordPress

Opublikowany: 2022-04-15

Czy chcesz stworzyć zwijane nawigacje na pasku bocznym w WordPress? Ten samouczek pokaże Ci, jak stworzyć zwijane menu w WordPress za pomocą darmowej wtyczki.

Odwiedzający Twoją stronę docenią łatwość zwijanej nawigacji. Nie zajmuje zbyt dużo miejsca na pasku bocznym. Jest to idealne rozwiązanie dla witryn handlu elektronicznego, dużych witryn internetowych i wszelkich innych witryn o złożonym układzie.

W tym artykule pokażemy, jak utworzyć menu paska bocznego WordPress, które się zwija.

Kolego X

Spis treści

Co to jest zwijane menu paska bocznego? Kiedy powinieneś go użyć?

Większość menu jest łatwa w użyciu i zapewnia użytkownikom szybki dostęp do wszystkich niezbędnych łączy. Witryny z wieloma stronami lub złożonymi układami mogą mieć z tym trudności.

Wyobraź sobie dużą witrynę eCommerce z wieloma kategoriami i podkategoriami produktów.

Nie jest dobrym pomysłem wystawianie każdego produktu w jednym menu. Kupujący mogą być zmuszeni przewinąć kilka menu, aby znaleźć produkt, którego szukają.

To zalety posiłków składanych. Te menu porządkują swoją zawartość zgodnie z relacją rodzic-dziecko. Kliknięcie elementu nadrzędnego w zwiniętym menu otworzy go, aby wyświetlić całą zawartość podrzędną dla tego rodzica.

Przeczytaj także: Motyw WordPress Professional University do tworzenia internetowej platformy edukacyjnej

W przypadku swojej strony mobilnej serwis informacyjny Guardian używa uproszczonego menu. Menu rozwijane to menu zwijane, ponieważ ich sekcje rozwijają się, gdy odwiedzający je klikają.

Menu zwijane domyślnie ukrywają złożone treści i informacje przed odwiedzającymi. Jest to łatwiejsze niż przewijanie długiej listy podkategorii i kategorii.

Zobaczmy teraz, jak utworzyć zwinięty pasek boczny w witrynie WordPress.

Jak stworzyć składane menu na pasku bocznym w WordPress

Dzięki wtyczce Bellows Accordion Menu możesz utworzyć menu paska bocznego w WordPress. Menu Bellows Accordion zawiera krótki kod do umieszczenia zwiniętej listy na dowolnej stronie, poście lub obszarze widżetów. Obejmuje to Twój pasek boczny.

1. Składane menu na pasku bocznym w WordPress

Składane menu paska bocznego w WordPress.

Najpierw zainstaluj wtyczkę, a następnie ją aktywuj. Aby uzyskać pomoc, zapoznaj się z naszym przewodnikiem dotyczącym instalacji wtyczki WordPress.

Po aktywacji przejdź do strony menu Wygląd >> z pulpitu WordPress .

2. Tworzenie menu w panelu WordPress

Tworzenie menu w panelu WordPress.

W polu „Nazwa menuDodawanie stron do menu WordPressa” wprowadź nazwę swojego menu. Nazwa nie będzie widoczna dla odwiedzających witrynę, ponieważ jest tylko w celach informacyjnych. Następnie możesz kliknąć przycisk Utwórz menu.

Następnie wybierz strony, które chcesz dodać do swojej zwijanej nawigacji. WordPress domyślnie wyświetla tylko najnowsze strony. Kliknij kartę Wyświetl wszystko, aby wyświetlić pełną listę stron w Twojej witrynie.

3. Dodawanie stron do menu WordPress

Dodawanie stron do menu WordPress.

Możesz także kliknąć Wybierz wszystko. Spowoduje to przekształcenie wszystkich stron w zwijaną listę.

Po dokonaniu wyboru kliknij przycisk „Dodaj do menu” . Możesz także wybrać posty lub kategorie blogów i dodać niestandardowe linki. Więcej informacji znajdziesz w naszym przewodniku dotyczącym dodawania menu nawigacyjnego do WordPressa.

Przeciąganie i upuszczanie to świetny sposób na przenoszenie stron internetowych po dodaniu ich wszystkich do menu. Zmieni to kolejność wyświetlania tych stron w menu zwijania.

Zwiń menu skupiają się na relacji rodzic-dziecko. Kliknięcie elementu nadrzędnego w rozwijanym menu spowoduje wyświetlenie całej zawartości podrzędnej.

Przeczytaj także: Jak sprawić, by lokalny biznes skorzystał na marketingu społecznościowym?

Przeciągnij i upuść to wszystko, czego potrzebujesz, aby nawiązać to połączenie.

Następnie weź każde dziecko w ramiona i delikatnie pociągnij je w prawo. Umożliwi to zwolnienie strony. Spowoduje to wstawienie elementu i uczynienie go stroną podrzędną.

4. Dodawanie postów do menu WordPress

Dodawanie postów do menu WordPress.

Nie zapomnij kliknąć przycisku Zapisz zmiany, gdy skończysz.

Teraz chcemy dodać zwijane menu paska bocznego. Aby to osiągnąć, użyjemy krótkich kodów , które Bellows Accordion tworzy automatycznie.

Przejdź do Wygląd >> Menu , aby pobrać krótki kod. Jeśli karta Pokaż wszystko nie jest zaznaczona, upewnij się, że jest.

Kliknij pole Shortcodes Box, aby podświetlić wszystkie kody. Skopiuj ten kod, naciskając skrót klawiaturowy Command + c lub Ctrl + c.

Następnie wklej krótki kod do widżetu. Przejdź do Wygląd >> Widżety . Spowoduje to wyświetlenie wszystkich widżetowanych obszarów w bieżącym motywie. Chociaż opcje mogą się różnić, większość motywów WordPress zawiera pasek boczny.

5. Konfiguracja rozwijanych menu paska bocznego

Konfigurowanie rozwijanych menu paska bocznego.

Kliknij pasek boczny, aby go rozwinąć. Spowoduje to rozszerzenie sekcji.

Kliknij ikonę +, aby dodać blok. Zacznij pisać skróty. Wybierz opcję Blokuj krótki kod, gdy się pojawi.

6. Jak dodać widżety do paska bocznego WordPress?

Jak dodać widżety do paska bocznego WordPress. Wklej krótki kod dla swojego zminimalizowanego Menu do tego bloku. Kliknij przycisk Aktualizuj u góry ekranu, aby opublikować swoje menu.

Podczas odwiedzania Twojej witryny powinno teraz pojawić się nowe, zwijane menu nawigacyjne na pasku bocznym.

To domyślne menu można dostosować za pomocą wtyczki Bellows Accordion. Aby lepiej odzwierciedlić swoją markę, możesz zmodyfikować schemat kolorów w swojej witrynie.

Przeczytaj także: 10 najlepszych wskazówek dotyczących blogowania dla studentów college'u

Możesz zmienić domyślne menu, przechodząc do Wygląd >> Menu poniżej na pulpicie WordPress.

To menu zawiera wszystkie ustawienia potrzebne do personalizacji składanego posiłku. Istnieje wiele ustawień, które możesz zbadać. Pomocne może być rozpoczęcie od odwiedzenia strony Konfiguracja główna >> Konfiguracja podstawowa .

7. Konfiguracja wyglądu i stylu rozwijanego menu paska bocznego WordPress

Konfigurowanie wyglądu i stylu rozwijanego menu paska bocznego WordPress.

Możesz wybierać spośród wielu kolorów menu. Możesz również zdecydować, czy wiele podmenu może być rozwijanych jednocześnie za pomocą ustawień składania akordeonu.

Kliknij kartę „Układ i położenie”, aby zmienić szerokość i wyrównanie menu.

8. Umieszczanie zwijanych menu na stronie WordPress

Możesz natychmiast wyświetlić podgląd zmian, edytując zwijaną nawigację paska bocznego w programie WordPress Customizer. Aby to zrobić, przejdź do Wygląd >> Dostosuj .

Wybierz Mieszek w menu po lewej stronie.

Konfigurowanie składanych menu w programie WordPress Customizer.

Wniosek

Brndle

Znajdziesz wiele opcji konfiguracji zwijanego paska bocznego . Możesz dostosować jego szerokość, wyrównanie lub kolor. Mamy nadzieję, że ten artykuł okazał się pomocny w tworzeniu prostego menu paska bocznego w WordPress.


Ciekawe lektury:

Musisz znać podstawowe i skuteczne umiejętności blogowania

Co to jest strona filaru? I korzyści ze strategii SEO wynikające z używania motywu

Najlepsza usługa optymalizacji prędkości 6 WordPress