Edytor Gutenberg – formatowanie

W poprzednim wpisie omawialiśmy podstawowe bloki Gutenberga. Dziś omówimy kolejny element blokowy czyli formatowanie.

Zacznijmy od bloku klasycznego. Jest to osadzony w bloku dawny edytor tekstowy WordPressa. W jego górnym panelu znajdują się podstawowe funkcje szybkiej edycji tekstu, takie jak np. pogrubienie, wypunktowanie, zmiana koloru czy wstawienie niestandardowego znaku.

Jeżeli tęsknimy za dawną metodą wprowadzania tekstów, śmiało możemy z niego korzystać, uważając tylko, aby nie wprowadziło to zbytniego zamieszania.

Blok kod a własny HTML

Blok kod pozwala na wyświetlenie czytelnikom dowolnego fragmentu kodu. Jest to przydatna funkcja np. dla blogów o tematyce informatycznej lub wszędzie tam, gdzie chcemy umożliwić odbiorcom odczytanie i skopiowanie danego fragmentu dowolnego kodu. W praktyce wypełnione pole wyświetli nasz kod w ten sposób:

<b>To jest pogrubiony tekst.</b>

Inaczej zachowa się natomiast blok Własny HTML, który pozwala na umieszczenie kodu HTML, wówczas powyższy przykład zostanie wyświetlony tak:

Już na etapie wprowadzania kodu w tym bloku, mamy możliwość szybkiego podglądu efektu:

Tekst preformatowany

Kolejnym blokiem jest Formatowany (wcześniej znany jako preformatowany). Ten blok jest przeznaczony przede wszystkim do wyświetlania tekstu, jednak w przeciwieństwie do bloku akapitu, zachowuje on odstępy i podziały wierszy dokładnie tak, jak zostały wprowadzone. Jest on jakby hybrydą bloku Akapit i bloku Kod.

Tekst wprowadzony w tym bloku zostanie wyświetlony tak. 

Wyróżniony cytat

W poprzednim tekście opisaliśmy blok Cytat, jako ten podstawowy do wyróżnienia treści. W tym bloku twórcy działają o krok dalej, dodając więcej opcji – między innymi dwie poziomie linie, które jeszcze lepiej wyodrębnią cytowany tekst. Bloku tego możemy użyć do wyróżnienia dłuższych informacji np. fragmentów książek. W bocznym panelu znajdziemy m.in. szybką możliwość wyboru koloru linii oraz tekstu, a także style całości – domyślny lub z tłem.

Zauważmy, że efekt końcowy będzie zależny od naszego motywu, także podgląd może niekoniecznie pokrywać się z rzeczywistością. Dla zobrazowania przykładu podgląd naszego bloku bezpośrednio w edytorze wygląda tak:

Werset czyli coś dla poetów

Blok Werset jest idealny do pisania wierszy. Opcje w nim są wprawdzie takie same jak w bloku Akapitu, ale Werset pozwala dodawać dodatkowe spacje między słowami i znakami podziału w bloku. Należy pamiętać, że niekiedy ostylowanie motywu może zaburzyć układ tego bloku.

Jak wygląda to w praktyce:

Tutaj piszemy wiersz o WordPressie
       Dodajemy kilka spacji...
   Zupełnie tak, jak chcemy...

Tabele

Ostatnim blokiem w sekcji Formatowanie jest Tabela. 
Bardzo przydatny, jak nazwa wskazuje, pozwala na osadzenie tabel na stronie lub we wpisie. Pamiętajmy, że używamy tego bloku do wyświetlania danych, które należy zaprezentować w formie tabelek, a nie do projektowania układu całej (do podziału strony używamy bloku kolumn, o którym jeszcze będziemy pisać w kolejnych tekstach). 

Na początek korzystania z tego bloku musimy podać podstawowe dane o liczbie kolumn oraz wierszy:

Po wprowadzeniu odpowiednich wartości, otrzymamy tabelę, którą możemy łatwo edytować, dzięki wielu dodatkowym funkcjom. Na przykład w górnych opcjach jest możliwe scalanie komórek czy dodawanie dodatkowych kolumn.

Ponadto w bocznym panelu dodano kolejne możliwości, takie jak m.in. zmiana stylu tabeli, wyróżnienie nagłówka oraz stopki, dodanie kolorów tła itp. Oto przykładowa tabela:

W następnym artykule omówimy układy strony w Gutenbergu. Do przeczytania!