Jak dodać przycisk w edytorze WordPress [samouczek]

Jak dodać przycisk w edytorze WordPress [samouczek]

Dlaczego blok przycisków WordPress jest tak ważny?

Nawigacja na stronie internetowej jest ważna dla odwiedzających i klientów. Chcemy wysłać ich z jednej podstrony dalej. Poprowadzić ich przez cały proces zakupowy. Dlatego tak ważne jest prawidłowe umieszczanie ważnych linków w treści strony.

Zasadniczo mamy 2 opcje. Użycie standardowego linku lub przycisku. Opinie na temat tego, kiedy użyć pierwszej i drugiej opcji są różne. Zwykle na jednej stronie istnieje wiele możliwych działań. Musimy upewnić się, która z nich jest podstawowa, a która drugorzędna. Zalecamy użycie przycisku tylko dla głównej akcji. W ten sposób osiągniesz większą widoczność tej podstawowej akcji. Skupisz uwagę odwiedzających na tej akcji. Możemy go również nazwać przyciskiem wezwania do działania. Nie twórz zbyt wielu przycisków na jednej podstronie.

Jakie są główne funkcje przycisków?

  • Przyciski mogą przyciągnąć uwagę odwiedzających - wezwanie do działania
  • Oddzielają zawartość strony lub postu i sprawiają, że jest ona bardziej czytelna
  • Pomoc w orientacji na stronie. Wielu odwiedzających skanuje stronę tylko wzrokiem
  • Nawigowanie odwiedzających do innych stron za pomocą hiperłączy

Istnieje wiele parametrów, które decydują o sukcesie przycisku. Ważny jest na przykład rozmiar, umiejscowienie lub kolor przycisku. Konieczne jest przestrzeganie standardowych zasad UI i UX. Zielony kolor jest używany dla przycisków z pozytywną akcją, na przykład do zakupu. Kolor czerwony jest przeznaczony dla negatywnych - na przykład do wypisania się z newslettera. Prawidłowo zaprojektowane przyciski w ten sposób bezpośrednio wpływają na działania odwiedzających.

Dodawanie przycisku na dowolnej stronie lub poście w WordPress

Sytuacja przed WordPress 5

Dodawanie przycisków było dość skomplikowanym procesem przed wynalezieniem edytora bloków WordPress. Ponieważ ta funkcja nie była naturalnie dostępna w WordPress. Można było użyć motywu z Page Builder lub wtyczką innej firmy. Shortcodes tworzą przyciski w tym przypadku.

W naszych starszych motywach WordPress można dodać przycisk za pomocą skrótów w edytorze wizualnym. Po kliknięciu na Insert Shortcode -> Button można ustawić różne ustawienia w oknie modalnym. Tekst, kolor tekstu, kolor przycisku, adres URL, wyrównanie i tak dalej. Dzięki tym zaawansowanym ustawieniom można łatwo i szybko dodać przycisk bez konieczności programowania.

Dodawanie przycisku za pomocą skrótów
Dodawanie przycisków za pomocą skrótów przed wydaniem edytora bloków

Jak używać bloku przycisków w edytorze WordPress?

Dzięki WordPress 5 istnieje drugi sposób. Znacznie łatwiejszy. Edytor wizualny WordPress wprowadza wiele przydatnych bloków. Aby utworzyć przycisk na stronie internetowej, możesz teraz użyć bloku przycisku WordPress w edytorze.

Przewodnik krok po kroku, jak dodać przycisk w edytorze WordPress

1. Na początku musisz zdecydować, gdzie chcesz wstawić przycisk
2. Blok przycisków można dodać na różne sposoby:
- klikając "+" na górnym pasku lub w dowolnym miejscu edytora bloków, w którym wybrano blok przycisków

Przycisk dodawania klikając na "+"
Dodawanie bloku przycisków poprzez kliknięcie "+"
Przycisk dodawania za pomocą paska wyszukiwania
Dodawanie bloku przycisków za pomocą paska wyszukiwania
Dodaj blok przycisków za pomocą ukośnika
Dodawanie bloku przycisków za pomocą ukośnika "/"

- Możesz również znaleźć dowolny blok za pomocą paska wyszukiwania, po prostu wpisz "przycisk"

- wpisując "/", co daje dostęp do wszystkich dostępnych bloków

3. Utworzony blok Button można dalej konfigurować

Dodaj tekst przycisku i adres URL

Po utworzeniu przycisku WordPress Block możesz wpisać w nim tekst. Pamiętaj, że w przypadku przycisku wezwania do działania lepiej jest użyć krótkiego tekstu z jasnym przekazem. Możesz ustawić pogrubienie, kursywę lub podkreślenie tekstu. Wszystkie te zmiany można wprowadzić, klikając na pasku narzędzi. Przycisk można również wyrównać do boku lub wyśrodkować.

Edycja przycisków
W ciągu kilku sekund możesz całkowicie zmienić wygląd swojego przycisku

Przycisk zazwyczaj wskazuje na inną stronę lub witrynę zewnętrzną. Z tego powodu tuż pod nim znajduje się pole do dodania adresu URL. Zaletą jest to, że dodanie adresu URL nie wymaga zaznaczania tekstu.

Zmiana koloru przycisku

Nowy edytor pozwala zmienić blok przycisków WordPress w kilka sekund. Wystarczy użyć ustawień na pasku bocznym po prawej stronie. Możesz zmienić kolor tła przycisku lub kolor tekstu wewnątrz przycisku. Dostępne są podstawowe predefiniowane kolory lub można wybrać własne. Wszystkie zmiany są widoczne od razu, aby sprawdzić, czy kombinacja kolorów jest odpowiednia.

Zmiana koloru przycisku
Natychmiastowa zmiana koloru przycisku po kliknięciu na wybrany kolor

Świetną funkcją jest to, że jeśli wybierzesz niewłaściwe kombinacje, na przykład szare tło i biały kolor tekstu, edytor bloków WordPress ostrzeże Cię, że przycisk może nie być czytelny na Twojej stronie.

Znajdź swój własny styl przycisków

Opcje stylu przycisków
Zmiana stylu przycisku bezpośrednio z paska narzędzi lub ustawień Inspektora

Aby utworzyć lub zmienić przycisk bardzo szybko i bez wysiłku, można użyć jednego z przygotowanych stylów. Przycisk można w ten sposób zmienić na przykład na zaokrąglony, obramowany lub prostokątny. Eksperymentuj, co najlepiej pasuje do stylu lub projektu Twojej witryny.

Przycisk edycji z niestandardowym CSS

Jeszcze większą personalizację można osiągnąć za pomocą niestandardowych klas CSS. W ten sposób możesz dodać własne style CSS i stylizować przycisk w edytorze WordPress dokładnie tak, jak chcesz.

Niestandardowe dane wejściowe klasy
Wstaw niestandardową klasę, aby nadać styl przyciskowi

Jak widzimy, istnieje znacznie łatwiejszy sposób niż użycie przycisku shortcode. Blok przycisku WordPress może być używany w dowolnym motywie, który jest kompatybilny z edytorem bloków WordPress. Przeczytaj więcej o naszym nowym motywie WordPress Citadela. Został on specjalnie zaprojektowany i opracowany dla edytora bloków WordPress.

Dodatkowa wskazówka na końcu

Nie zapomnij monitorować bloku przycisków WordPress i powodzenia samego przycisku. Jeśli korzystasz z Google Analytics, możesz utworzyć unikalny adres URL. Aby śledzić kliknięcia odwiedzających, możesz dodać Parametr Google UTM. Adres URL można utworzyć za pomocą kreatora adresów URL. Dodanie parametrów pozwala zidentyfikować źródło odwiedzin. Jest to bardzo przydatne, jeśli chcesz wiedzieć, skąd odwiedzający trafili na Twoją stronę zakupów.

Jaki jest obecnie największy problem z blokiem przycisków WordPress? Porozmawiajmy o tym w komentarzach poniżej. Podziel się swoimi doświadczeniami z używaniem przycisków na stronie.

4 pomyślał o „How to add button in WordPress editor [tutorial]

  1. Dzięki za udostępnienie tego samouczka. Czy możesz również poprowadzić mnie, jak mogę utworzyć szablon bloku? Robię to samo, używając tego zasobu https://wpitech.com/create-wordpress-gutenberg-block-templates/ ale daje błąd i mam kilka linii programowania na froncie. To jest kod
    add_action( 'init', function() {
    $args = array(
    'publiczny' => true,
    'label' => 'News',
    'show_in_rest' => true,
    'template_lock' => 'all',
    'template' => array(
    array( 'core/paragraph', array(
    'placeholder' => 'Breaking News',

  2. Czy wiesz, czy istnieje sposób na zwinięcie treści za pomocą przycisku bez pobierania wtyczki? Zasadniczo używam wordpress.com premium, a nie biznesowego, więc pobieranie wtyczek nie jest tak naprawdę łatwą opcją.

    Dzięki!

    1. Witam,

      dzięki za pytanie. Powinieneś zapytać bezpośrednio zespół wsparcia wordpress.com, czy mogą zaoferować jakieś rozwiązanie, aby rozwiązać Twój problem. Pozdrawiam!
      Zlatko
      Zespół AIIT

Możliwość dodawania komentarzy nie jest dostępna.