Twój ostateczny przewodnik dotyczący korzystania z nadchodzącego edytora WordPress Gutenberg

W ciągu najbliższych kilku miesięcy sposób, w jaki tworzysz treści za pomocą WordPressa, radykalnie się zmieni. Obecny edytor tekstu, którego używasz od lat, zniknie, zastąpiony przez zupełnie nowy edytor WordPress Gutenberg.

Taka duża zmiana to prawdopodobnie dzwonek alarmowy w twojej głowie…

Czy Twoje przepływy pracy zostaną przerwane? Czy Twoje obecne wtyczki i motywy będą nadal działać? Jak możesz dalej tworzyć świetne treści za pomocą tego nowego edytora?

W tym poście poznasz odpowiedzi na te pytania oraz wiele więcej .

Jest to najlepszy przewodnik po edytorze WordPress Gutenberg dla każdego, kto tworzy treści za pomocą WordPress.

Nauczysz się:

1. Czym jest edytor WordPress Gutenberg, dlaczego/kiedy się pojawi oraz odpowiedzi na kilka podstawowych często zadawanych pytań.
2. Jak naśladować obecną funkcjonalność edytora i utworzyć podstawowy post na blogu za pomocą Gutenberga.
3. Kilka wskazówek dotyczących bardziej produktywnej pracy z Gutenbergiem ( na podstawie moich praktycznych doświadczeń z używania go w witrynie na żywo ).
4. Jak wykorzystać nowe funkcje w Gutenberg, aby korzystać z funkcji treści i układu, do których nigdy wcześniej nie miałeś dostępu.

Ten nowy edytor nadchodzi bez względu na wszystko, więc poświęć trochę czasu na zapoznanie się z edytorem WordPress Gutenberg, abyś był gotowy do pracy, gdy tylko zostanie wydany!

Czym jest edytor Gutenberg, a także dlaczego powinno cię to obchodzić

Edytor Gutenberg to kompletne przeobrażenie obecnego edytora tekstu WordPress, którego używasz do tworzenia postów lub stron za pomocą WordPress.

Mówię reimagination zamiast przeprojektowania, ponieważ jest naprawdę odbudowy doświadczenie edycji od podstaw.

Po zakończeniu opracowywania Gutenberg zastąpi obecny edytor tekstu WordPress i użyjesz edytora Gutenberg do tworzenia treści w przyszłości ( choć będziesz mieć opcje, jeśli chcesz pozostać przy obecnym doświadczeniu – więcej o tym później ).

Więc co sprawia, że ​​Gutenberg Editor to „całkowita nowa wyobraźnia”?

Najpierw zacznijmy od odświeżenia tego, co rozumiem przez „edytor WordPress”. Jeśli nie jesteś do końca pewien, o czym mówiłem, oto jak wygląda obecny edytor TinyMCE WordPress :

Jeśli używasz Wordable do publikowania postów WordPress bezpośrednio z Dokumentów Google, możesz nie spędzać tam dużo czasu! Ale założę się, że nadal istnieje duża szansa, że ​​dobrze znasz działanie edytora.

Redaktor Gutenberga wprowadza coś, co nazywa się „blokami”

Obecny edytor tekstu WordPress jest trochę jak jeden długi dokument Microsoft Word. Gutenberg zmienia tę dynamikę za pomocą czegoś, co nazywa się blokami .

Zamiast pojedynczego pola edycyjnego, każda „rzecz” w Gutenbergu jest swoim własnym „blokiem”. Jeśli kiedykolwiek napisałeś post na Medium – to ten sam pomysł .

Na przykład:

• Każdy akapit tekstu to osobny blok.
• Obraz jest osobnym blokiem.
• Film na YouTube jest osobnym blokiem.
• …Masz pomysł.

Następnie montujesz swoje treści za pomocą serii bloków. Na przykład, oto jak ta sama treść z góry wygląda w Gutenbergu. Ma cztery różne bloki:

• Trzy oddzielne bloki akapitów
• Jeden blok obrazu

Znaczenie tego podejścia opartego na blokach polega na tym, że odblokowuje bardziej zaawansowane możliwości treści i układu.

Na przykład będziesz mógł wprowadzać kolumny, wstawiać i stylizować przyciski oraz wykonywać wiele innych czynności, których albo nie możesz wykonać w bieżącym edytorze, albo które wymagają HTML/CSS w bieżącym edytorze.

Później omówię bloki bardziej szczegółowo. Ale jeśli chcesz teraz zmoczyć stopy, możesz pobawić się demonstracją na żywo edytora Gutenberg, kierując się tutaj – nie musisz niczego instalować.

Oto dlaczego główny zespół WordPressa wprowadza tę zmianę

Przez większość swojego życia WordPress używał tego samego podstawowego edytora (TinyMCE). Chociaż projekt mógł ulec zmianie tu i tam, podstawowa funkcjonalność nigdy się nie zachwiała.

Dlaczego więc zmiana teraz? Jeśli działało przez ostatnie ~15 lat, dlaczego nie może działać przez następne 15 lat?

Powodów jest kilka.

Po pierwsze, obecny edytor jest po prostu zbyt ograniczający dla zwykłych użytkowników w dzisiejszych czasach. Chociaż WordPress umożliwia tworzenie wszystkiego, co możesz sobie wyobrazić, robi to tylko wtedy, gdy znasz trochę HTML/CSS .

Połącz to z konkurencją ze strony twórców wizualnych witryn internetowych, takich jak Squarespace i Wix ( którzy obaj podwoili swoje wykorzystanie w ciągu ostatniego roku ) , a możesz zrozumieć, dlaczego główny zespół WordPressa uważał, że WordPress potrzebuje bardziej elastycznego środowiska edycji, aby zachować przewagę.

Po drugie, Gutenberg zapewnia możliwość ujednolicenia wielu różnych interfejsów, które mają zapracowani użytkownicy WordPressa. Nie chcę tutaj być zbyt techniczny. Ale jeśli korzystasz z wtyczek innych firm, prawdopodobnie masz różne skróty, pola meta i obszary ustawień, które są częścią przepływów pracy WordPress.

Gutenberg może ujednolicić wszystkie te różne interfejsy w system blokowy.

Po trzecie, Gutenberg wprowadza do WordPressa nowoczesne technologie. W szczególności Reaguj. Pomaga to nie tylko samemu edytorowi, ale także pozwala zewnętrznym programistom pracować z tymi nowoczesnymi technologiami.

Wreszcie, edycja treści to dopiero początek tego procesu. Chociaż w tej chwili Gutenberg zmieni tylko sposób tworzenia postów i stron, ostatecznym celem jest przejście Gutenberga do pełnego wizualnego projektowania stron internetowych.

Plusy i minusy przejścia do nowego edytora Gutenberg

Więc… czy Gutenberg będzie dla ciebie dobrą rzeczą?

Cóż, w społeczności WordPressa był to dość dzielący problem, z gorącymi kłótniami po obu stronach.

Z jednej strony masz ludzi, którzy zachwalają zalety Gutenberga:

• Więcej możliwości dla treści – Gutenberg dodaje gotowe bloki dla przycisków, cytatów itp. Daje to większą kontrolę nad treścią bez potrzeby niestandardowego CSS. Dodatkowo wtyczki innych firm mogą dodawać własne bloki treści, co zapewnia jeszcze większą elastyczność.
• Więcej możliwości układu — poza nowymi możliwościami zawartości, otrzymujesz również nowe opcje układu, takie jak możliwość dołączania kolumn lub separatorów bez konieczności stosowania niestandardowego kodu.
• Zunifikowane doświadczenie – zamiast używać skrótów do wstawiania treści z wtyczek innych firm, wtyczki te będą mogły tworzyć własne bloki, co zapewnia prostsze, bardziej ujednolicone doświadczenie edycji.
• Przyjazny dla urządzeń mobilnych – Gutenberg domyślnie działa świetnie na urządzeniach mobilnych, co pozwala tworzyć lub edytować treści z dowolnego urządzenia.

Ale z drugiej strony ludzie zwracają uwagę na poważne problemy związane z tak ambitnym projektem:

• Kompatybilność wsteczna – ~32% całego Internetu korzysta z obecnego edytora WordPress, co bardzo utrudnia przejście na zupełnie nowe doświadczenie edycji. Zasadniczo jest tak wiele skrajnych przypadków z całą tą starą zawartością, że trudno jest zapewnić płynne przejście.
• Trudne dla programistów — twórcy motywów i wtyczek będą musieli wbudować kompatybilność Gutenberga w swoje wtyczki i motywy, a starsze rozszerzenia mogą nie zawsze działać idealnie. Istnieją dziesiątki tysięcy starszych wtyczek, które mogą powodować problemy ze zgodnością.
• Edukacja użytkowników — podczas gdy nowi użytkownicy mogą polubić Gutenberga, starzy użytkownicy będą musieli nauczyć się nowych przepływów pracy, co jest szczególnie trudne dla programistów, którzy zbudowali witryny dla klientów nietechnicznych.

Czy edytor WordPress Gutenberg jest czymś dobrym czy złym?

Cóż, wtrącam tutaj jakąś osobistą opinię , ale myślę, że Gutenberg będzie pozytywną zmianą na dłuższą metę . Będziesz mieć większą kontrolę nad wyglądem i działaniem zawartości bez konieczności korzystania z zewnętrznych rozwiązań lub niestandardowych rozwiązań kodu.

Mając to na uwadze, zdecydowanie istnieje możliwość krótkotrwałego wzrostu, jeśli chodzi o kompatybilność z istniejącymi wtyczkami, których możesz użyć. I trudno będzie zmusić ogromną bazę użytkowników WordPressa do nauczenia się nowego interfejsu.

Kiedy ukaże się The Gutenberg Editor?

Krótka odpowiedź brzmi – nie znamy dokładnej daty . Gutenberg zostanie wydany jako część WordPress 5.0, ale nie ma jeszcze oficjalnej informacji o dokładnej dacie wydania WordPress 5.0.

Teraz mamy jednak ogólny pomysł. Zgodnie z niedawnym spotkaniem inauguracyjnym WordPress 5.0 , przewidywane daty to już 19 listopada 2018 r. lub dopiero 22 stycznia 2019 r .

Oto dłuższa odpowiedź:

Obecnie Gutenberg Editor istnieje jako wtyczka w stanie beta. Jeśli chcesz, możesz zainstalować wtyczkę i zacząć jej używać na swojej stronie już dziś ( jest to jednak wersja beta, więc nie polecam jej ).

Po zakończeniu beta i testowaniu zespół WordPress połączy edytor Gutenberg z podstawowym oprogramowaniem WordPress w WordPress 5.0 . Następnie, po zaktualizowaniu witryny WordPress do WordPress 5.0, Edytor Gutenberga automatycznie zastąpi obecny edytor TinyMCE.

Co się stanie z twoją istniejącą zawartością po wydaniu edytora Gutenberga?

Ponieważ Gutenberg zastępuje obecnego edytora, prawdopodobnie zastanawiasz się, co stanie się z całą twoją istniejącą zawartością.

Nie martw się — Gutenberg został stworzony z myślą o wstecznej kompatybilności .

W obecnej formie Gutenberg umieszcza całą Twoją starą zawartość w jednym bloku Classic . Na przykład, oto jak wygląda powyższy przykład TinyMCE po zainstalowaniu Gutenberga:

Jeśli chcesz, możesz kontynuować pracę w tym jednym klasycznym bloku, choć doświadczenie jest nieco niezręczne. Możesz też kliknąć ikonę trzech kropek, aby przekonwertować starą zawartość na bloki Gutenberga:

Po przekonwertowaniu starej zawartości na bloki będzie ona działać tak samo, jak każdy inny post w edytorze Gutenberg.

Ponieważ edytor Gutenberg używa tego podejścia opartego na pojedynczym klasycznym bloku dla starych treści, nie powinno być żadnych problemów z przejściem. Możliwe jednak, że napotkasz problemy z wtyczkami innych firm, więc nadal powinieneś zachować czujność i sprawdzać stare treści.

Czy edytor Gutenberga będzie działał ze wszystkimi motywami WordPress?

Tak! Ponownie, ponieważ Gutenberg będzie domyślnym edytorem, naturalnie musi działać z dowolnym motywem WordPress.

Mając to na uwadze, są pewne rzeczy, które programiści mogą zrobić, aby dodać specjalne funkcje do Gutenberga, więc wkrótce zaczniesz widzieć „zgodny z Gutenbergiem” w materiałach marketingowych wielu motywów.

Oto, co sprawia, że ​​motyw jest kompatybilny z Gutenbergiem:

• Specjalna stylizacja bloków – motywy mogą dodać specjalną stylizację do podstawowych bloków Gutenberga. Gwarantuje to, że wszystkie klocki Gutenberga idealnie pasują do projektu Twojego motywu.
• Wyrównanie na całej szerokości – Gutenberg pozwala tworzyć obrazy o pełnej szerokości, które rozciągają się na cały ekran, ale tylko wtedy, gdy twórcy motywów specjalnie to umożliwią.
• Stylizacja edytora – twórcy motywów mogą również dodawać własne style do interfejsu edycji zaplecza Gutenberga . Stwarza to bardziej wizualne podejście do projektowania. Przykład możesz zobaczyć tutaj .

Czy musisz korzystać z edytora Gutenberga po wydaniu WordPress 5.0?

Nie! Chociaż Gutenberg będzie domyślnym edytorem w WordPress 5.0, tak naprawdę nie musisz go używać.

Jeśli chcesz nadal korzystać z obecnego edytora WordPress, istnieje oficjalna wtyczka Edytora klasycznego, która ukrywa wszystkie ślady Gutenberga i przywraca bieżące środowisko edycji.

Alternatywnie, ta wtyczka umożliwia również korzystanie z obu edytorów i przełączanie się między nimi na zasadzie post-by-post.

WordPress Gutenberg Tutorial – Jak będziesz korzystać z nowego edytora

Ok, teraz, gdy ukończyłeś swój szybki kurs Gutenberg 101, przejdźmy do praktycznego edytora Gutenberg.

Celem tej sekcji jest zapoznanie się z edytorem Gutenberga, abyś mógł uderzyć w ziemię, gdy tylko zostanie zwolniony.

Aby rozpocząć, oto grafika, która pomoże Ci zrozumieć podstawowe elementy interfejsu edytora Gutenberg:

1. To jest ciało redaktora. To tam będziesz pracować z treścią
2. Te przyciski umożliwiają dodawanie nowych bloków . Jeśli chcesz dodać obraz, wideo lub inną zawartość blokową, użyjesz ich.
3. Tutaj dodajesz tytuł swojego posta.
4. Te opcje pozwalają zapisywać wersje robocze, wyświetlać podglądy i ostatecznie publikować posty.
5. Jeśli nie masz zaznaczonego bloku, ten pasek boczny pozwala zarządzać ogólnymi opcjami postu, takimi jak kategorie i wyróżniony obraz. Kiedy masz wybrany blok, to daje opcje dla tego konkretnego bloku.

Następnie, gdy przejdziesz do dodania nowego bloku, zobaczysz to wyskakujące okienko z listą wszystkich dostępnych bloków. Możesz albo:

1. Użyj zakładek akordeonu, aby przeglądać wszystkie dostępne bloki
2. Wyszukaj bezpośrednio żądany blok

Jak stworzyć prosty wpis na blogu za pomocą edytora Gutenberg

W tej sekcji dowiesz się, jak wykonać te same czynności, które możesz już wykonywać w bieżącym edytorze WordPress .

Zasadniczo dowiesz się, jak dostosować istniejący przepływ pracy do edytora Gutenberg. Następnie w następnej sekcji pokażę, jak skorzystać z nowej funkcjonalności edytora Gutenberg.

Dodawanie lub formatowanie podstawowej treści tekstowej

Podstawowa treść tekstu akapitowego jest prosta — wystarczy kliknąć i wpisać. Jedyną natychmiastową różnicą jest to, że za każdym razem, gdy naciśniesz Enter, aby utworzyć nową linię, Gutenberg automatycznie utworzy nowy blok dla następnego akapitu:

Po kliknięciu bloku zobaczysz pasek narzędzi formatowania, na którym możesz:

• Zmień wyrównanie
• Dodaj pogrubienie i kursywę
• Wstaw linki
• Itp.

Zasadniczo działa to podobnie do paska narzędzi w bieżącym edytorze:

Później pokażę ci fajną alternatywę dla tego domyślnego podejścia.

Oprócz opcji formatowania na pasku narzędzi dostępne są również opcje na prawym pasku bocznym, które umożliwiają:

• Kontroluj rozmiar i kolor tekstu
• Dodaj inicjał

Jak dotąd dość proste, prawda?

Tworzenie nagłówka (H1, H2 itd.)

Masz kilka różnych opcji tworzenia nagłówka.

Najpierw możesz użyć ikony +, aby wstawić nowy blok nagłówka :

Po wstawieniu bloku pozycją, można wpisać, aby dodać tekst i korzystać z paska bocznego lub paska narzędzi do kontroli co nagłówek do użytku (np vs H2 H3):

Alternatywnie możesz również:

• Przekształć zwykły blok akapitu w blok nagłówka, używając przycisku Zmień typ bloku .
• Użyj przecen, aby utworzyć nagłówek (na przykład „## To jest nagłówek 2”)

Oto GIF ilustrujący te dwie metody:

Wstawianie obrazów, filmów lub innych treści multimedialnych

Ok, więc teraz możesz tworzyć i formatować zarówno podstawowy tekst, jak i nagłówki. To zaprowadzi cię na większość drogi!

Ale co z wstawianiem treści multimedialnych?

Aby wstawić dowolną zawartość multimedialną, możesz użyć tej samej ikony +, aby wstawić blok.

Aby wstawić zawartość multimedialną pod istniejącą zawartością, użyj ikony + w lewym górnym rogu.

Alternatywnie możesz także wstawić nowy blok między istniejącą treścią, najeżdżając kursorem na miejsce, w którym chcesz wstawić treść. Następnie użyjesz przycisku Dodaj blok po lewej stronie nowego bloku:

Po otwarciu wyskakującego okienka Wstaw blok możesz wybrać:

• Obraz – wstaw obraz z biblioteki multimediów WordPress lub zewnętrznego adresu URL.
• Wideo — umieść wideo z biblioteki multimediów WordPress lub zewnętrznego adresu URL.
• Osadzenia – oddzielne bloki, które pomogą Ci osadzać treści z YouTube, Vimeo, Spotify, SoundCloud, Instagram i mnóstwa innych źródeł.

Na przykład, oto jak wygląda wstawianie obrazu z biblioteki multimediów WordPress:

A oto jak możesz osadzić film z YouTube:

Wstawianie skrótów z innych wtyczek

Jeśli jesteś jak większość użytkowników WordPressa, prawdopodobnie masz wtyczki, które umieszczasz w swoim poście lub treści strony za pomocą skrótów.

Ostatecznie celem tego typu wtyczek jest tworzenie własnych bloków Gutenberga, których można bezpośrednio używać ( więcej o tym później ). Ale do tego czasu nadal możesz dołączyć skróty do treści Gutenberga, używając bloku Shortcode :

Zmiana układu treści (masz dwie opcje)

Ok, na razie dość łatwe… ale co, jeśli chcesz zmienić kolejność swoich bloków?

Aby to zrobić, masz dwie opcje.

Po pierwsze, jeśli najedziesz myszą na lewo od bloku*, możesz użyć przeciągania i upuszczania, aby przesuwać bloki:

Po drugie, możesz również użyć strzałek w górę lub w dół, aby przesunąć bloki w górę lub w dół o jedną pozycję:

*Aby aktywować funkcję przeciągania i upuszczania, przytrzymaj mysz nad 6 kropkami między strzałkami w górę iw dół.

Praca z informacjami zakulisowymi (kategorie, URL Slug itp.)

Ok, więc powyższe powinno obejmować sposób dodawania podstawowej zawartości bloga. Ale co z pozostałymi zakulisowymi etapami przygotowywania posta do publikacji?

Do większości czynności możesz użyć karty Dokument na pasku bocznym. Tutaj będziesz:

• Wybierz z wyprzedzeniem datę publikacji/zaplanuj posty
• Wybierz autora
• Dodaj kategorie i tagi
• Wybierz swój polecany obraz
• Wpisz swój fragment

Dodatkowo możesz użyć przycisków nad tym paskiem bocznym, aby:

• Wyświetl podgląd swojego posta
• Zapisz wersje robocze ( Gutenberg automatycznie zapisuje wersję roboczą, więc zwykle nie musisz tego robić ręcznie )
• Opublikuj swój post

Jedyną trudną rzeczą jest ustawienie slugu adresu URL twojego posta lub strony. Aby to edytować, kliknij tytuł. Następnie będziesz mógł edytować ślimak:

A co z wtyczkami takimi jak Yoast SEO? Jak będą działać?

Istnieje duża szansa, że ​​masz jakieś inne wtyczki backendowe, które musisz skonfigurować dla każdego elementu treści.

Istnieją dwa sposoby interakcji z tymi wtyczkami.

Po pierwsze, wielu programistów już pracuje nad bezpośrednią kompatybilnością Gutenberga. Na przykład Yoast SEO obsługuje już Gutenberga, a ustawienia Yoast SEO skonfigurujesz bezpośrednio z tego samego paska bocznego dokumentu :

W przypadku starszych wtyczek, które nie mają jeszcze obsługi Gutenberga, nadal będziesz mógł używać metaboxów, tak jak w edytorze TinyMCE:

Sześć wskazówek, jak pracować wydajniej z Gutenbergiem

Kiedy po raz pierwszy zaczynasz pracę z edytorem Gutenberga, może wydawać się trochę powolny. Te wskazówki mogą przyspieszyć proces i ułatwić szybkie wstawianie i dostosowywanie potrzebnych bloków.

1. Szybkie wstawianie bloków, wpisując „/”, aby zaoszczędzić mnóstwo czasu

Metoda wstawiania bloków, którą pokazałem powyżej, jest pomocna, gdy dopiero zaczynasz pracę z Gutenbergiem, ponieważ pozwala zobaczyć wszystkie dostępne bloki.

Ale kiedy już zapoznasz się z potrzebnymi blokami, możesz je wstawiać znacznie szybciej, korzystając z funkcji szybkiego wstawiania.

Zamiast klikać ikonę + , po prostu:

• Naciśnij Enter, aby utworzyć nowy blok
• Wpisz „/”
• Zacznij wpisywać nazwę bloku

Podczas pisania Gutenberg automatycznie zasugeruje pasujące bloki. Następnie po prostu naciśnij Enter, aby wstawić żądany blok.

Oto w akcji:

To dużo szybciej, prawda?

2. Naucz się skrótów klawiaturowych, aby przyspieszyć edycję

Gutenberg jest wyposażony w skróty klawiaturowe, które mogą przyspieszyć Twoją pracę.

Możesz wyświetlić pełną listę tych skrótów, klikając CTRL + Alt + H (Windows) lub CMD + Alt + H (Mac):

Powinieneś przeczytać pełną listę, ale oto niektóre z najbardziej pomocnych:

• Ctrl + S – zapisz wersję roboczą.
• Ctrl + Z – cofnij lub Ctrl + Y – ponów.
• Ctrl + Alt + Backspace – usuń zaznaczony blok ( bardzo przydatne ).
• Ctrl + Shift + D – duplikuj wybrany blok.
• Ctrl + Alt + T – wstawia nowy blok przed zaznaczonym blokiem.
• Ctrl + Alt + Y – wstawiamy nowy blok za wybranym blokiem.

Możesz także użyć większości globalnych skrótów, takich jak Ctrl + B do pogrubienia lub Ctrl + V do wklejenia.

3. Przeciągnij obrazy z pulpitu do treści Gutenberg

Jeśli potrzebujesz dołączyć dużo obrazów, jest to kolejna fajna sztuczka.

Zamiast ręcznie tworzyć nowy blok obrazu dla każdego obrazu, możesz po prostu przeciągnąć obraz prosto z folderu na pulpicie do miejsca, w którym możesz umieścić go w swoim poście.

WordPress automatycznie prześle go do biblioteki multimediów i wstawi tam. Jest tylko jedna rzecz, na którą należy zwrócić uwagę – upewnij się, że widzisz niebieską linię podczas przeciągania obrazu , w przeciwnym razie nie zadziała:

4. Dodaj stały pasek narzędzi do edycji

Jedną z rzeczy, które niektórzy ludzie uważają za trudne w Gutenbergu, jest to, że pasek narzędzi do edycji stale miga i znika, gdy klikasz między różnymi blokami akapitów.

Jeśli ci się to nie podoba, możesz włączyć opcję Unified Toolbar , aby uzyskać zawsze obecny pasek narzędzi u góry interfejsu Gutenberga:

5. Użyj składni Markdown dla nagłówków, list itp.

Jeśli lubisz używać przecen, będziesz mógł włączyć pewną składnię przecen w Gutenbergu.

Na przykład:

• ## – tworzy H2 ( już to widziałeś – przekształca się w blok nagłówka ).
• * – rozpoczyna listę nieuporządkowaną.
• 1. – uruchamia uporządkowaną listę.
• > – tworzy cytat blokowy ( przekształca się w blok cytatu ).

Nie możesz używać całej składni przecen. Ale powyższe przykłady są już bardzo pomocne przy szybszym formatowaniu:

6. W razie potrzeby edytuj kod HTML bezpośrednio

Jeśli trafisz w sytuację, w której chcesz bezpośrednio edytować kod HTML, możesz uzyskać dostęp do edytora kodu, klikając trzy kropki w prawym górnym rogu lub używając skrótu Ctrl + Shift + Alt + M :

Wykorzystaj nową funkcjonalność Gutenberga — kolumny, przyciski i nie tylko!

Dobrze, omówiliśmy:

• Jak używać Gutenberga do tworzenia podstawowego posta na blogu.
• Kilka wskazówek, jak przyspieszyć pracę z Gutenbergiem.

Teraz przejdźmy do nowych, fajnych rzeczy, które możesz zrobić z Gutenbergiem. To ekscytujące funkcje, które powinny pomóc wyjaśnić, dlaczego zespół WordPressa zdecydował się pójść naprzód z Gutenbergiem.

Przyciski wstawiania — kod HTML nie jest wymagany

W starym edytorze jedynym sposobem tworzenia przycisków było ręczne dodanie klasy CSS lub użycie wtyczki innej firmy.

W przypadku Gutenberga wystarczy dodać blok Button . Aby edytować tekst przycisku, wystarczy kliknąć i wpisać. Aby zmienić kolory, możesz użyć paska bocznego:

Twórz układy wielokolumnowe

W starym edytorze nie było możliwości tworzenia układów wielokolumnowych bez własnego niestandardowego kodu HTML lub wtyczki innej firmy.

W przypadku Gutenberga wystarczy dodać blok Kolumny . Następnie możesz dodać inne bloki w różnych kolumnach:

Twórz rozciągnięte obrazy o pełnej szerokości

Jeśli Twój motyw to obsługuje , otrzymasz nową opcję wyrównania do pełnej szerokości, która umożliwia rozciąganie obrazów na cały ekran, co otwiera kilka interesujących układów treści:

Twórz szablony bloków wielokrotnego użytku

Jeśli regularnie używasz tej samej kombinacji bloków, możesz zaoszczędzić czas, tworząc grupę bloków wielokrotnego użytku.

Najpierw możesz kliknąć i przeciągnąć, aby zaznaczyć wszystkie bloki, które chcesz uwzględnić. Następnie możesz użyć trzech kropek, aby dodać do bloków wielokrotnego użytku :

Nadasz mu nazwę. Następnie będziesz mógł wstawić cały szablon, tak jak każdy inny blok:

Możesz dodać więcej bloków i funkcji za pomocą wtyczek innych firm

Oto, gdzie Gutenberg zaczyna być jeszcze fajniejszy:

Wtyczki innych firm mogą dodawać własne bloki, których można używać w projektach Gutenberga.

Możesz z tego skorzystać na dwa sposoby:

• Wtyczki, których już używasz , stworzą własne bloki Gutenberga. Na przykład, jeśli używasz wtyczki kalendarza wydarzeń, będziesz mógł wstawiać wydarzenia tylko za pomocą bloku wydarzeń wtyczki.
• Deweloperzy tworzą dedykowane wtyczki Gutenberg, które dodają mnóstwo ogólnych nowych bloków treści, które zapewniają większą kontrolę nad projektami.

Na przykład sprawdź bezpłatną wtyczkę Stackable . Po zainstalowaniu i aktywacji otrzymasz zupełnie nowy zestaw klocków do układania w stos w Gutenberg:

A potem możesz użyć tych bloków, aby zrobić całkiem fajne rzeczy, takie jak wstawienie tabeli cen lub referencji:

To dopiero początek edytora WordPress Gutenberg

I to wszystko! Jeśli dotarłeś tak daleko, powinieneś być guru Gutenberga, który jest gotowy do działania, gdy tylko WordPress 5.0 zostanie wydany.

Chociaż nauka nowego przepływu pracy nie znajduje się na listach „zabawnych sposobów na spędzenie weekendu”, opanowanie tajników Gutenberga będzie niezbędne dla każdego, kto korzysta z WordPressa.

Nie tylko Gutenberg będzie wpływać na sposób, że tworzenie treści w tej chwili, to również będzie odgrywać główną rolę w WordPressie posuwają się do przodu.

Wszystko, co widziałeś powyżej, to tylko pierwsza faza Gutenberga. W fazie drugiej Gutenberg przejdzie do szablonów stron, a faza trzecia przekształci Gutenberga w narzędzie do pełnej personalizacji witryny .

Więc… zaprzyjaźnij się z Gutenbergiem, ponieważ w ciągu najbliższych kilku lat będziesz go często oglądać!