Jak dodać menu panelu slajdów w motywach WordPress

Jeśli jesteś programistą WordPress lub projektantem motywów WordPress, możesz chcieć dodać niestandardowe menu w edytorze motywów, aby kontrolować opcje menu. Jednak pulpit administratora WordPress nie ma domyślnie opcji menu panelu slajdów . Oznacza to, że musisz skorzystać z wtyczki lub szablonu innej firmy, aby dodać tę funkcję do swoich motywów. Dlatego dzisiaj wyjaśnimy, jak dodać menu panelu slajdów w motywach WordPress.

Menu panelu slajdów w motywach WordPress: po co to uwzględniać?

Istnieje wiele powodów, dla których włączenie panelu bocznego może być ważne. Pierwszym powodem jest to, że odwiedzający będą mogli łatwiej poruszać się po Twojej witrynie WordPress, jeśli poświęcisz czas na opracowanie intuicyjnych menu. Drugim powodem jest to, że panele przesuwne są niezbędne dla urządzeń mobilnych. Dlatego musisz upewnić się, że je masz, jeśli chcesz, aby Twoja strona dobrze funkcjonowała na urządzeniach mobilnych . Jeśli jednak wielu użytkowników Twojej witryny będzie korzystać z urządzeń mobilnych, przetestowanie układu menu na tych mniejszych wyświetlaczach jest niezbędne przed uruchomieniem WordPress. Na szczęście podczas przeglądania na urządzeniu mobilnym wiele domyślnych stylów motywów WordPress będzie wyświetlać menu przyjazne dla urządzeń mobilnych. Pełnoekranowe responsywne menu lub dynamiczne menu panelu slajdów w motywach WordPress może być miłym akcentem w celu dalszej personalizacji mobilnej nawigacji. Z tego powodu przyjrzyjmy się integracji przesuwanego menu panelu z motywami WordPress.

Krok pierwszy: zainstaluj wtyczkę Responsive Menu

Instalacja i włączenie wtyczki Responsive Menu to pierwszy krok. Istnieją dwie różne wersje tej wtyczki, wersja płatna i darmowa . Podczas gdy płatna wersja Responsive Menu oferuje kilka fajnych dodatków, takich jak logika warunkowa i więcej opcji motywu, w tym samouczku będziemy używać wtyczki open source. Po włączeniu responsywnego menu przejdź do opcji Menu responsywne > Menu. Jak tylko tam będziesz, przejdź do paska narzędzi i naciśnij przycisk „Utwórz nowe menu”. Nadaj nazwę swojemu nowemu menu i zapisz swoją pracę. Nie martw się, jeśli pojawi się informacja, że ​​jest pusta.

Krok drugi: wybierz motyw

Nowe responsywne menu zapewni wtedy cztery różne opcje projektowania. Możesz kupić więcej motywów, jeśli chcesz. W tym samouczku wykorzystany zostanie motyw wybrany przez system. Następnie możesz przejść dalej, wybierając opcję „Dalej”. Jeśli jeszcze tego nie zrobiłeś, nadaj nazwę swojemu responsywnemu menu, a następnie wybierz typ menu z pulpitu nawigacyjnego WordPress , który chcesz wyświetlać na pasku bocznym. Na potrzeby tego samouczka wybraliśmy opcję „Nawigacja”.

Jeśli chcesz, aby odwiedzający widzieli tylko nowe menu panelu slajdów, możesz również ukryć domyślne menu, które pojawia się wraz z motywem WordPress. Aby to zrobić, użyj obszaru oznaczonego „Ukryj menu motywu” , aby wprowadzić kod CSS. Kliknij przycisk „Dowiedz się więcej”, aby uzyskać więcej informacji na temat wprowadzania odpowiedniego kodu dla wybranego motywu. Wersja Pro dodaje kilka dodatkowych opcji dostosowywania dla użytkownika.

Krok trzeci: skonfiguruj

Po dostosowaniu parametrów do własnych upodobań, możesz wygenerować swoje menu, klikając przycisk „Utwórz menu”. Gdy to zrobisz, po prawej stronie zobaczysz podgląd swojej witryny, z opcjami przełączenia na tryb mobilny, tablet lub komputer na dole . Po lewej stronie zobaczysz dalsze ustawienia personalizacji. Zwróć uwagę na język, który pojawia się nad opcjami menu. Tutaj wyświetlany jest zarówno tytuł menu, jak i wiersz „Dodatkowa zawartość”, zgodnie z etykietą wtyczki.

Wybierz „Menu mobilne”, a następnie „Kontener” z menu bocznego, aby wprowadzić zmiany lub ukryć tekst. W obszarze Tekst tytułu możesz wprowadzić dowolne elementy, od „Menu główne” do „Nawigacja”. Aby wyłączyć pasek tytułu, po prostu przełącz przełącznik oznaczony „Tytuł” ​​w położenie wyłączone. Gdy to zrobisz, przejdź do opcji „Dodatkowa zawartość”. Masz możliwość wyłączenia tej funkcji lub zastąpienia tekstu dowolnym innym. Po dostosowaniu menu nie zapomnij kliknąć przycisku „Aktualizuj” u dołu strony.

Przed uruchomieniem ważne jest przeprowadzenie wstępnych testów. Aby upewnić się, że wszystko działa poprawnie, możesz użyć innej przeglądarki niż ta, której zwykle używasz do uzyskiwania dostępu do swojej witryny. W tym przykładzie użyliśmy przeglądarki Google Chrome. Aby uzyskać dostęp do witryny na urządzeniach mobilnych, pobraliśmy aplikację o nazwie „ Internet Explorer na Androida”. Skopiowaliśmy i wkleiliśmy adres URL tej witryny do aplikacji, a wyniki były zdumiewające. Odkryliśmy, że menu było prawidłowo sformatowane zarówno w orientacji poziomej, jak i pionowej, a wszystkie linki działały zgodnie z oczekiwaniami. Twój przebieg może się jednak różnić, jeśli chodzi o urządzenia mobilne. Zachęcamy do przetestowania menu na jak największej liczbie urządzeń i przeglądarek przed opublikowaniem. Jeśli znajdziesz jakieś problemy, teraz jest czas, aby je naprawić.

Krok piąty: rozpocznij transmisję na żywo

Po przetestowaniu menu i upewnieniu się, że wszystko działa zgodnie z planem, czas udostępnić je publiczności. Kliknij ikonę menu w prawym górnym rogu witryny i wybierz „Ustawienia menu” z menu rozwijanego. Zobaczysz listę pozycji z tytułem „Menu mobilne” u góry listy. W tym miejscu wpiszesz adres internetowy swojej strony z wtyczką Mobile Menu. Po zakończeniu kliknij „Zapisz zmiany” i poczekaj kilka sekund, aż zmiany zaczną obowiązywać. Otóż ​​to!

Wniosek

Teraz, gdy wiesz, jak dodać menu panelu slajdów w motywach WordPress, wypróbuj je na własnej stronie. A teraz, jeśli kiedykolwiek zechcesz zaktualizować swoją witrynę o dodatkowe menu, wiesz, jak to zrobić . Mamy nadzieję, że ten artykuł pomógł Ci nauczyć się nowej umiejętności i nie pozostawił Cię przytłoczonym.