Przewodnik dla początkujących: Jak używać wzorców blokowych WordPressa

Tworzenie witryn WordPress nigdy nie było łatwiejsze, a wzorce blokowe są tego dużą częścią. Kiedy odkryliśmy je po raz pierwszy, dostrzegliśmy ich potencjał w przyspieszeniu naszego przepływu pracy.

Obecnie używamy blokowych wzorców, takich jak bloki wielokrotnego użycia dla wezwań do działania i przycisków ofert kuponowych – stały się one niezbędne do tworzenia treści.

Wzorce blokowe ułatwiają uzyskanie profesjonalnie wyglądających projektów bez konieczności posiadania umiejętności kodowania lub projektowania stron internetowych.

Są to gotowe kombinacje bloków, które można szybko wstawić i dostosować, co daje przewagę zamiast zaczynania od zera za każdym razem.

Niezależnie od tego, czy budujesz swoją pierwszą witrynę WordPress, czy chcesz pracować szybciej, ten przewodnik dla początkujących pokaże ci, jak znaleźć, używać i tworzyć wzorce bloków, które oszczędzają czas przy każdym projekcie.

Oto tematy, które omówimy w tym przewodniku:

Czym są szablony bloków WordPress?

Wzorce bloków WordPress to wstępnie zaprojektowane kolekcje bloków, które pomagają szybko i efektywnie tworzyć niestandardowe układy. Były one dla nas przełomem podczas tworzenia stron w napiętych terminach.

Edytor bloków w WordPress jest intuicyjny i pozwala użytkownikom projektować piękne układy z blokami treści. Obejmują one tekst, obrazy, przyciski i inne elementy, które można rozmieścić zgodnie z własnymi potrzebami.

Jednak nie wszyscy użytkownicy mają czas lub umiejętności projektowe, aby za każdym razem tworzyć układy od podstaw. Sami zmierzyliśmy się z tym wyzwaniem, dlatego też szablony blokowe są tak cennym narzędziem w naszym przepływie pracy.

Szablony blokowe oferują łatwe rozwiązanie. WordPress domyślnie zawiera wiele gotowych szablonów, dzięki czemu można łatwo dodać profesjonalnie wyglądające układy w kilka sekund.

Popularne motywy WordPress często zawierają własne niestandardowe szablony. Te szablony pozwalają zaoszczędzić jeszcze więcej czasu, dając ci gotowe projekty dostosowane do twojego motywu.

Wzorce mogą obejmować układy, takie jak projekty wielokolumnowe, kombinacje multimediów i tekstu, sekcje wezwań do działania, nagłówki i niestandardowe przyciski. Ta elastyczność sprawia, że nadają się one do różnych typów treści.

Więcej szablonów bloków można również znaleźć na stronie WordPress.org. Jeśli podoba ci się projektowanie, możesz nawet tworzyć i udostępniać własne szablony społeczności WordPress.

Następnie pokażemy, jak korzystać z szablonów blokowych w WordPress, aby tworzyć wspaniałe układy dla swojej witryny.

Jak używać wzorców blokowych w WordPressie

Domyślnie WordPress zawiera kilka przydatnych wzorców bloków, które możesz wykorzystać na swojej witrynie internetowej. Twój motyw WordPress i niektóre wtyczki mogą również dodawać swoje wzorce.

Aby użyć wzorców blokowych, należy edytować wpis lub stronę WordPress, na której ma zostać użyty wzorzec blokowy.

Na ekranie edycji posta kliknij przycisk Dodaj blok [+], aby wstawić blok. W tym miejscu przejdź do karty “Wzory”, aby wyświetlić dostępne wzory bloków.

Możesz przewinąć w dół, aby zobaczyć dostępne wzorce bloków.

Można również zobaczyć wzorce bloków w różnych kategoriach, takich jak funkcje, przyciski, kolumny, nagłówki i inne.

Możesz także kliknąć przycisk “Przeglądaj wszystkie wzorce”, aby wyświetlić wzorce bloków.

Tutaj można zobaczyć większe podglądy w wyskakującym okienku.

Gdy znajdziesz wzorzec, który chcesz wypróbować, po prostu kliknij, aby wstawić go do treści twojego wpisu lub strony.

Wzorzec pojawi się w edytorze treści z treścią zastępczą, którą możesz edytować i zastąpić twoją własną.

Wystarczy wskazać i kliknąć dowolny blok wewnątrz wzorca, aby edytować i zmieniać jego treść zgodnie z twoimi wymaganiami.

Nadal będziesz mieć wszystkie opcje, które normalnie masz dla każdego bloku. Na przykład, jeśli jest to blok okładki, możesz zmienić kolor okładki lub obraz tła.

Możesz dodać tyle wzorców, ile potrzebujesz dla twojego wpisu na blogu lub strony. Możesz także usunąć wzorzec, aby usunąć go z wpisu lub strony, tak jak usuwasz dowolny blok WordPress.

Korzystając ze wzorców blokowych, możesz szybko tworzyć 111111 piękne układy dla twoich artykułów i witryny WordPress.

Ostatecznie, wzorce bloków pomagają zaoszczędzić czas, który w przeciwnym razie można by poświęcić na ręczne układanie bloków za każdym razem, gdy trzeba dodać nagłówek, galerię, przyciski i inne elementy.

Jak tworzyć wzorce w edytorze bloków

WordPress umożliwia bardzo łatwe tworzenie wzorców w edytorze bloków, które można później ponownie wykorzystać.

Podczas edycji postu lub strony wystarczy wybrać bloki, które mają zostać uwzględnione w szablonie i kliknąć przycisk “Utwórz szablon”.

Możesz wybrać wiele bloków, naciskając klawisz Shift na twojej klawiaturze i klikając je.

Jeśli jednak twoje bloki są ułożone w sposób, który utrudnia ich wybranie, możesz użyć widoku listy w karcie Przegląd dokumentu.

Utworzenie wzorca spowoduje wyświetlenie okna podręcznego.

Będziesz musiał podać nazwę twojego wzorca i wybrać kategorię.

Poniżej znajduje się przełącznik umożliwiający synchronizację lub synchronizację wzorca.

Zsynchronizowane wzorce: Gdy użytkownik lub inni użytkownicy edytują wzorzec, zmiany te zostaną zapisane przy następnym użyciu tego wzorca.

Niezsynchronizowane szablony: Zmiany dokonane w tych wzorcach po wstawieniu ich do postu lub strony nie będą miały wpływu na oryginalny wzorzec.

Kliknij przycisk “Utwórz”, aby zapisać wzór.

Następnym razem, gdy będziesz chciał użyć tego wzorca, wystarczy wyszukać jego nazwę lub kategorię w wybieraku wstawiania bloków.

Jak tworzyć wzorce w edytorze witryn

Jeśli korzystasz z motywu blokowego z pełną obsługą edytora witryn, możesz również tworzyć wzorce w edytorze witryn.

Otwórz edytor witryn, przechodząc na stronę Wygląd ” Edytor.

Przejdziesz teraz do interfejsu edytora witryn.

Kliknij “Wzory” na lewym pasku bocznym, aby kontynuować.

Zobaczysz wszystkie dostępne wzory i kategorie.

Aby utworzyć nowy wzorzec, kliknij przycisk Dodaj [+], a następnie wybierz opcję “Utwórz wzorzec”.

Spowoduje to wyświetlenie wyskakującego okienka, w którym należy podać nazwę twojego wzorca, wybrać kategorię i zdecydować, czy wzorzec ma być zsynchronizowany, czy niezsynchronizowany.

Kliknij “Utwórz”, aby kontynuować.

WordPress stworzy puste płótno do stworzenia twojego wzorca.

Z tego miejsca możesz dodawać bloki, aby zaprojektować twój wzorzec.

Po zakończeniu nie zapomnij kliknąć przycisku “Zapisz”, aby zapisać wzór.

Zarządzanie wzorcami w WordPressie

Jeśli korzystasz z motywu blokowego z pełną obsługą edytora witryn, możesz zarządzać wzorcami w edytorze witryn.

Otwórz edytor witryn, przechodząc na stronę Wygląd ” Edytor.

Na ekranie Wzorce można kliknąć wzorzec, aby go edytować. Można również kliknąć menu z trzema kropkami obok wzorca, aby go powielić, wyeksportować lub usunąć.

Aby zarządzać wszystkimi wzorami, kliknij kartę “Zarządzaj wszystkimi moimi wzorami” na pasku bocznym.

Spowoduje to wyświetlenie listy wszystkich twoich wzorców. Teraz możesz je edytować, eksportować lub usunąć.

Jeśli korzystasz z klasycznego motywu (motywy WordPress, które nie obsługują pełnego edytora witryny), możesz zarządzać wzorami, odwiedzając stronę Wygląd ” Wzory.

Z tego miejsca można dodawać, usunąć i eksportować twoje wzorce bloków.

Należy pamiętać, że nawet niektóre klasyczne motywy, takie jak Hestia, zarządzają teraz wzorcami podobnie do motywów Full Site Editing, podczas gdy inne nadal używają starszego interfejsu pokazanego na poniższym zrzucie ekranu.

Sposób zarządzania wzorcami bloków zależy więc tak naprawdę od używanego motywu.

Więcej wzorców bloków do wykorzystania na twojej witrynie internetowej

Domyślnie WordPress zawiera kilka powszechnie używanych wzorców bloków. Motywy WordPress mogą również dodawać własne wzorce do twojej witryny internetowej.

Możesz jednak znaleźć o wiele więcej wzorców bloków niż te dostępne w wybieraku bloków na twojej witrynie internetowej.

Wystarczy przejść do witryny internetowej WordPress Patterns Directory, aby zobaczyć wiele innych wzorów bloków.

Tutaj znajdziesz szablony bloków przesłane przez społeczność WordPress.

Aby użyć jednego z tych wzorów bloków, wystarczy kliknąć, aby wyświetlić wzór, a następnie kliknąć przycisk “Kopiuj wzór”.

Następnie musisz wrócić do swojego bloga WordPress i edytować wpis lub stronę, na której chcesz wstawić ten wzorzec bloku.

Na ekranie edycji wystarczy kliknąć prawym przyciskiem myszy i wybrać “Wklej” w menu przeglądarki lub nacisnąć CTRL + V (Command + V na Macu).

Jak tworzyć i udostępniać twoje wzorce bloków?

Chcesz tworzyć swoje własne wzorce bloków WordPress i dzielić się nimi ze światem?

WordPress umożliwia bardzo łatwe tworzenie wzorców bloków i używanie ich na twoich witrynach internetowych lub udostępnianie ich wszystkim użytkownikom WordPressa na całym świecie.

Wystarczy odwiedzić witrynę WordPress Pattern Directory i kliknąć łącze “New Pattern”.

Uwaga: Aby zapisać swoje szablony, musisz się zalogować lub utworzyć bezpłatne konto WordPress.org.

Po zalogowaniu przejdziesz do strony edytora szablonów bloków. Jest on identyczny z domyślnym edytorem bloków WordPress i można go użyć do utworzenia szablonu.

Wystarczy dodać bloki, aby stworzyć twój układ wzorca.

Możesz użyć bloków układu, takich jak grupa, okładka, galeria i innych, aby uporządkować twój układ.

Dostępne są również obrazki bez tantiem do wykorzystania w twoich blokach multimedialnych. Biblioteka multimediów WordPress pozwoli ci łatwo znaleźć i wykorzystać te obrazki w twoich wzorcach.

Gdy twój wzorzec bloku będzie satysfakcjonujący, możesz zapisać go jako wersję roboczą lub przesłać do katalogu wzorów.

Przed przesłaniem twojego wzorca bloków do katalogu wzorców upewnij się, że zapoznałeś się z wytycznymi dotyczącymi katalogu wzorców bloków.

Możesz zarządzać wszystkimi swoimi wzorami bloków, klikając łącze “Moje wzory”. Wyświetli on wszystkie udostępnione wzory bloków, wersje robocze wzorów i wzory, które zostały przez ciebie polubione.

Jeśli chcesz tworzyć wzorce bloków tylko na twój własny użytek, możesz zapisać je jako wersje robocze. Następnie skopiuj i wklej je ze strony Moje wzorce na twoją witrynę internetową WordPress.

Ręczne tworzenie wzorców bloków WordPress

Możesz również tworzyć wzorce bloków ręcznie i dodawać je do twojego motywu WordPress lub konfiguratora fragmentów kodu, takiego jak WPCode.

Wystarczy utworzyć nowy wpis lub stronę w WordPress. W obszarze treści użyj bloków, aby utworzyć własny układ lub kolekcję bloków, którą chcesz zapisać jako wzorzec.

Następnie przełącz się do trybu edytora kodu.

Z tego miejsca należy skopiować całą treść widoczną w edytorze kodu.

Następnie otwórz zwykły edytor tekstu, taki jak Notatnik i wklej ten kod. Będzie on potrzebny w następnym kroku.

Teraz możesz zarejestrować twoje bloki jako wzorzec.

Aby to zrobić, wystarczy skopiować i wkleić poniższy kod do pliku functions.php motywu lub wtyczki fragmentów kodu, takiej jak darmowa wtyczka WPCode (zalecane).

Aby uzyskać więcej informacji, oto kompletny przewodnik po dodawaniu własnego kodu w WordPress.

function wpb_my_block_patterns() {
    register_block_pattern(
        'my-plugin/my-awesome-pattern',
        array(
            'title'       => __( 'Two column magazine layout', 'my-theme'),
            'description' => _x( 'A simple magazine style two-column layout with large image and stylized text', 'my-theme' ),
            'categories'  => array( 'columns' ),
            'content'     => ' Your block content code goes here'
            )
    );
}
add_action( 'init', 'wpb_my_block_patterns' );

Teraz skopiuj i wklej skopiowane wcześniej nieprzetworzone dane bloku jako wartość parametru content. Innymi słowy, musisz zastąpić tekst, który mówi: “Twój kod zawartości bloku znajduje się tutaj” kodem bloku. Pamiętaj, aby pozostawić pojedyncze cudzysłowy otaczające tekst.

Na koniec nie zapomnij zmienić tytułu i opisu na własne i zapisać zmiany.

Możesz teraz przejść na twoją witrynę internetową i edytować wpis lub stronę. Twój nowo zarejestrowany wzorzec bloku pojawi się w wybieraku bloków.

Jak usuwać wzorce bloków w WordPress?

Możesz łatwo usunąć lub wyrejestrować dowolny wzorzec blokowy w WordPress. Załóżmy, że chcesz usunąć wzorzec bloku utworzony w powyższym przykładzie.

Wystarczy skopiować i wkleić poniższy kod do pliku functions.php motywu lub WPCode:

function wpb_unregister_my_patterns() {
  unregister_block_pattern( 'my-plugin/my-awesome-pattern' );
}
add_action( 'init', 'wpb_unregister_my_patterns' );

W tym przykładzie "my-plugin/my-awesome-pattern" to nazwa wzorca, którego użyliśmy podczas rejestracji.

Możesz użyć tego kodu, aby wyrejestrować dowolny wzorzec bloku utworzony przez twój motyw lub wtyczkę. Wszystko, co musisz wiedzieć, to nazwa użyta do zarejestrowania wzorca.

Usuwanie rdzennych wzorców WordPressa

Rdzeniowe wzorce WordPressa są dostępne dla wszystkich użytkowników WordPressa. Oznacza to, że mogą być nadużywane i mogą nawet nie pasować do reszty twojego motywu WordPress.

Jeśli nie chcesz używać wzorca, możesz po prostu uniknąć dodawania go do treści. Jeśli jednak prowadzisz witrynę WordPress z wieloma autorami, możesz chcieć uniemożliwić wszystkim użytkownikom korzystanie z tych rdzeni.

Aby usunąć wszystkie rdzenne szablony WordPress, należy dodać następujący kod do pliku funkcji motywu lub WPCode:

remove_theme_support( 'core-block-patterns' );

Co się stało z blokami wielokrotnego użycia?

Wzorce bloków i bloki wielokrotnego użycia miały na celu rozwiązanie podobnego problemu: zapewnienie użytkownikom opcji łatwego dodawania często używanych bloków.

Aby to poprawić, zespół Core WordPress połączył bloki wielokrotnego użycia we wzorce.

Aby mieć taką samą funkcjonalność jak bloki wielokrotnego użycia, można teraz używać zsynchronizowanych wzorców. Gdy ty lub inni użytkownicy edytujecie wzorzec, zmiany te zostaną zapisane przy następnym użyciu tego wzorca.

Często zadawane pytania

Oto kilka pytań często zadawanych przez naszych czytelników na temat wzorców bloków.

Gdzie mogę znaleźć dodatkowe wzorce bloków?

Oprócz domyślnych wzorców w WordPressie, możesz zapoznać się z katalogiem wzorców WordPress online, aby uzyskać jeszcze więcej opcji stworzonych przez społeczność.

Czy wzorce blokowania mogą spowolnić moją witrynę internetową?

Nie, same wzorce bloków nie mają wpływu na szybkość działania twojej witryny. Są one sposobem na uporządkowanie treści, ale upewnij się, że używasz zoptymalizowanych obrazków i bloków, aby uzyskać najlepszą wydajność.

Aby uzyskać wskazówki, zapoznaj się z naszym przewodnikiem po szybkości i wydajności WordPressa.

Dodatkowe zasoby

Jeśli chcesz dostosować wygląd swojej witryny WordPress, przydatne będą poniższe zasoby:

• Jak łatwo stworzyć niestandardowy motyw WordPress (bez żadnego kodu)
• Jak przeprojektować witrynę WordPress (przewodnik dla początkujących)
• Najczęstsze problemy z edytorem bloków WordPress i sposoby ich poprawki
• Jak stylizować formularz komentarza WordPress (najlepszy przewodnik)
• Jak dostosować kolor tła edytora bloków WordPress?

Mamy nadzieję, że ten przewodnik pomógł ci nauczyć się korzystać ze wzorców bloków WordPress na twojej witrynie internetowej. Możesz również zapoznać się z naszym przewodnikiem na temat opanowania edytora blok ów WordPress lub zapoznać się z tymi przydatnymi skrótami WordPress, aby być bardziej produktywnym.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.