Dodawanie przycisków w menu nawigacyjnym WordPress

Czy chcesz dodać przycisk w menu nagłówka WordPress?

Dodanie przycisku w menu nawigacyjnym nagłówka pozwala stworzyć bardziej zauważalne wezwanie do działania. Może uzyskać więcej kliknięć do najważniejszych stron i stworzyć lepsze wrażenia użytkownika, pomagając odwiedzającym podjąć działania.

W tym artykule pokażemy, jak łatwo dodać Przycisk do menu nagłówka WordPress.

Adding buttons in WordPress navigation menu

Dlaczego dodać Przycisk w menu nagłówka WordPress?

Menu nawigacyjne WordPress to zwykle zwykłe linki tekstowe, które wyglądają tak samo. Pod względem konstrukcji wszystkie linki mają taką samą wagę i wagę.

Header navigation menu with plain links

Co zrobić, jeśli chcesz dodać link do formularza zamówienia online, link do strony logowania lub rejestracji lub link do Kup teraz? Te ważne wezwania do działania będą wyglądać tak jak reszta linków w menu nagłówka.

Zmiana ważnych linków w menu nawigacyjnym WordPress na przyciski sprawi, że będą one bardziej zauważalne. Pomaga to użytkownikom łatwo je znaleźć, poprawiając ich zaangażowanie i doświadczenie w witrynie.

Navigation menu with a button

Domyślnie WordPress ma opcje dodawania przycisków w postach i stronach WordPress za pomocą bloku przycisków. Nie ma jednak wbudowanej opcji dodawania przycisków w menu nawigacyjnym.

Na szczęście istnieje łatwy hack, aby przekonwertować dowolny link w menu nawigacyjnym WordPress na przycisk.

Mając to na uwadze, przyjrzyjmy się, jak dodać przycisk w menu nagłówka WordPress bez instalowania wtyczki.

Video Tutorial

Subskrybuj WPBeginner

Jeśli wolisz pisemne instrukcje, po prostu czytaj dalej.

Dodawanie przycisku w menu nagłówka WordPress

Najpierw musisz dodać link, który chcesz przekonwertować na przycisk do menu nawigacyjnego WordPress.

Po prostu przejdź do Wygląd ” Menu strona w pulpicie nawigacyjnym WordPress i dodaj link do menu nawigacyjnego.

Add a link to WordPress menu

Następnie musisz kliknąć przycisk Opcje ekranu u góry. Spowoduje to wyświetlenie menu fly down z kilkoma opcjami. Musisz zaznaczyć pole obok opcji 'CSS Classes’.

Show CSS classes in Screen Options

Teraz przewiń w dół do menu i kliknij, aby rozwinąć element menu, który chcesz przekonwertować na przycisk.

Add custom CSS class to a link

Zauważysz nową opcję klasy CSS w Ustawieniach pozycji menu. Tutaj musisz wprowadzić nazwę klasy. Możesz nazwać tę klasę CSS dowolną unikalną nazwą, ale ze względu na ten samouczek nazwiemy ją przyciskiem menu.

Po wprowadzeniu nazwy kliknij przycisk „Zapisz Menu”, aby zapisać zmiany.

Teraz, gdy dodaliśmy własną niestandardową klasę CSS do elementu menu, możemy ją zaprojektować, dodając własny niestandardowy kod CSS.

Po prostu przejdź do Wygląd ” Dostosuj aby uruchomić WordPress theme customizer.

Zobaczysz teraz podgląd na żywo swojej witryny po prawej stronie i kilka ustawień motywu w lewej kolumnie.

Additional CSS option in WordPress theme customizer

Teraz musisz kliknąć dodatkową kartę CSS, aby ją rozwinąć. Pokaże ci to pole, w którym możesz dodać swój własny kod CSS.

Tutaj możesz skopiować i wkleić następujący kod CSS jako punkt wyjścia.

.menu-button { 
background-color: # eb5e28;
border: 1px;
border-radius:3px;
-webkit-box-shadow:1px 1px 0px 0px #2f2f2f;
-moz-box-shadow: 1px 1px 0px 0px #2f2f2f;
box-shadow: 1px 1px 0px 0px #2f2f2f;
}
.menu-przycisk a, .menu-przycisk a: hover, .menu-przycisk a: aktywny { 
color: # fff !ważne;
}

Gdy tylko dodasz kod CSS, moduł dostosowania motywu automatycznie zastosuje go do podglądu witryny, a zmiany będą widoczne.

Nie martw się, zmiany nie będą dostępne w Twojej witrynie, dopóki nie klikniesz przycisku Publikuj.

Menu button preview

Możesz swobodnie bawić się CSS tak bardzo, jak chcesz. Możesz zmienić kolor tła, kolor tekstu łącza, dodać ramkę i wiele innych.

Nie zapomnij kliknąć przycisku Publikuj, aby zapisać zmiany.

Czy to nie było łatwe?

Możesz użyć tej sztuczki, aby nie tylko dodać przyciski do menu nagłówka, ale także wyróżnić dowolny link w menu nawigacyjnym WordPress.

Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak dodać przycisk w menu nagłówka WordPress. Chcesz zobaczyć, jak użytkownicy wchodzą w interakcję z Twoimi przyciskami? Zobacz nasz przewodnik, Jak śledzić Współczynnik konwersji w WordPress. Następnie sprawdź naszą listę najlepszych programów do czatu na żywo dla małych firm.

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 naprawić nieprawidłowy błąd JSON w WordPress (Przewodnik dla początkujących)

W artykule: Co powoduje błąd „nieprawidłowa odpowiedź JSON” w WordPress?1. Sprawdź adresy…

Jak zmienić kolor linku w WordPress (poradnik dla początkujących)

W artykule: Dlaczego Linki Są Ważne?Jak dodawać linki w postach i stronach…

Jak naprawić błąd krytyczny w WordPress (krok po kroku)

W artykule: Co To jest błąd krytyczny w WordPress?Co powoduje krytyczny błąd…

WordPress Pingbacks & Trackbacks: Ultimate A-Z Guide

W artykule: Czym są Pingbacks i Trackbacks? Plus, dlaczego są ważneCzym Są…