Czy widziałeś pełnoekranowe responsywne menu używane na popularnych blogach? Te menu są wyświetlane na stronie z domyślną ikoną hamburgera. Gdy użytkownik kliknie go lub dotknie, pojawia się nakładka pełnoekranowa zawierająca menu witryny z pięknym efektem. W tym artykule pokażemy, jak dodać responsywne menu pełnoekranowe w WordPress bez pisania kodu.

Fullscreen responsive menu overlay in WordPress

Video Tutorial

Subskrybuj WPBeginner

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

Pierwszą rzeczą, którą musisz zrobić, to zainstalować i aktywować wtyczkę Menu responsywnego DC Fullscreen. Po aktywacji musisz odwiedzić Wygląd ” menu pełnoekranowe DC strona konfiguracji ustawień wtyczki.

Fullscreen menu settings

Musisz wybrać menu z rozwijanej listy. Jeśli nie utworzyłeś jeszcze menu nawigacyjnego, sprawdź nasz przewodnik, Jak dodać menu nawigacyjne w WordPress.

Następnie musisz wybrać kierunek efektu slajdów dla menu pełnoekranowego. Możesz wybrać z góry, z prawej, z lewej, z dołu lub bez efektu.

Responsywne menu pełnoekranowe DC pozwala również wybrać kolor tła i tekstu dla menu. Upewnij się, że wybierasz kombinację, która jest łatwa dla oczu i pasuje do twojego schematu kolorów.

Przy wyborze koloru tekstu lub tła należy zawsze brać pod uwagę wpływ tych kolorów na czytelność.

Możesz wybrać czcionkę Google dla tekstu menu. Wystarczy wpisać nazwę czcionki, a wtyczka załaduje ją za Ciebie.

Nie zapomnij odznaczyć pola obok opcji „Mały link do autora”. Jeśli pozostawić zaznaczone, to doda link do strony autora wtyczki na wszystkich swoich stronach.

Na koniec kliknij przycisk Prześlij, aby zapisać ustawienia. Możesz teraz odwiedzić swoją stronę internetową, aby zobaczyć menu w akcji. Zalecamy zmianę rozmiaru przeglądarki, aby zobaczyć, jak zachowuje się menu na różnych rozmiarach ekranu.

Mamy nadzieję, że ten artykuł pomógł Ci dodać responsywne menu pełnoekranowe do swojej witryny WordPress. Możesz również zobaczyć nasz przewodnik, Jak dodać menu panelu slajdów w WordPress.

Jeśli podoba Ci się ten artykuł, zasubskrybuj nasz kanał YouTube dla samouczków wideo WordPress. Znajdziesz nas również na Twitterze i Facebooku.

You May Also Like

Jak stworzyć katalog stron w WordPress (krok po kroku)

W artykule: Co To jest katalog stron www?Metoda 1: Tworzenie katalogu WordPress…

Jak dodać stronę HTML Sitemap w WordPress (2 sposoby)

W artykule: Jaka jest różnica między mapami witryn XML i HTML?Metoda 1.…

Jak i dlaczego należy ograniczyć próby logowania w WordPress?

W artykule: Dlaczego warto ograniczyć próby logowania w WordPress?Jak ograniczyć próby logowania…

13 darmowych wtyczek do zarządzania użytkownikami dla WordPress (2021)

W artykule: Dlaczego potrzebujesz wtyczki do zarządzania użytkownikami w WordPress?1. Członkowie2. WPForms3.…