Co nowego w WordPress 5.6?

WordPressWordPress to najczęściej wybierany CMS na świecie. W oparciu o niego powstała niemal połowa istniejących stron internetowych. WordPress jest doceniany przez użytkowników ze względu na prostotę, intuicyjność i łatwość zarządzania. Ze względu na charakter open source, WordPress może być rozwijany i udoskonalany na potrzeby konkretnych, indywidualnych projektów. Jak zacząć korzystać z WordPressa? Aby rozpocząć przygodę z WordPressem, najpierw potrzebujesz hostingu dla WordPress. Hosting zapewnia miejsce na serwerze, gdzie będą przechowywane wszystkie pliki...Czym jest WordPress? 5.6 jest już oficjalnie dostępny do pobrania. Zawarte w nim zmiany nie są rewolucyjne, są raczej kontynuacją obranego w przeszłości kierunku rozwoju. Niestety, dwa nowe ekrany oparte o edytor blokowy, które są już prawie gotowe – ekrany widżetów i nawigacji – nie zostały włączone do WordPressa 5.6. Na to będziemy musieli poczekać do kolejnego wydania, które planowane jest na marzec 2021.

W tym artykule zebrałam kilka ciekawszych nowości, raczej z punktu widzenia użytkownika, ale i programiści powinni tu znaleźć coś dla siebie.

WordPress 5.6 – nowy motyw domyślny

Motyw Twenty Twenty-One został zaprojektowany jako “gołe” płótno dla edytora blokowego. Na pierwszy rzut oka nie wyróżnia się niczym szczególnym. A także, podobnie jak poprzednie motywy domyślne w WordPressie, nie posiada rozbudowanych ustawień. Możemy jedynie wybrać kolor tła oraz opcję wspierania dark mode.

Motyw zyskał jednak w moich oczach gdy zaczęłam budować poszczególne podstrony w edytorze blokowym, a także… gdy spojrzałam w jego kod źródłowy.

Przede wszystkim motyw Twenty Twenty-One jest świetnie dostosowany pod edytor blokowy. Bloki wyklikuje się bardzo przyjemnie, a styl w wp-adminie wiernie oddaje styl na frontendzie (no powiedzmy na 99% ). Ponadto, w motywie utworzone są dodatkowe style i wzorce bloków, z których możemy budować ciekawe układy stron

Domyślna strona główna, która zostaje utworzona poprzez tzw. starter content.

Strona, którą utworzyłam w edytorze blokowym, bez żadnych wtyczek i bez ingerencji w kod.

W edytorze blokowym możemy sobie utworzyć właściwie dowolny layoutLayout to termin używany w kontekście projektowania stron internetowych, aplikacji oraz innych interfejsów użytkownika. Oznacza on układ graficzny elementów na stronie, który ma na celu zapewnienie przejrzystości i intuicyjności w nawigacji. Layout może obejmować różne aspekty, takie jak rozmieszczenie tekstu, obrazów, przycisków oraz innych elementów interaktywnych. Jednym z najważniejszych czynników, które należy wziąć pod uwagę przy projektowaniu layoutu, jest użyteczność. Layout odgrywa fundamentalną rolę w organizacji treści na stronie, wpływając na to,...Czym jest Layout? strony głównej. Na podstronach sprawa się nieco komplikuje, gdyż u góry strony widoczny jest tytuł, a dopiero pod nim wyświetlają się treści z edytora blokowego. Nie jest to idealne, ale i tak na “gołym” motywie Twenty Twenty-One jesteśmy w stanie stworzyć przyzwoitą stronę firmową. Polecam także spojrzeć na bloga Agnieszki Bury, która we wpisie “Motyw Twenty Twenty-One w akcji – recenzja i przykłady stron” opisała 2 inne przykłady stron biznesowych utworzonych właśnie na takiej podstawowej wersji WordPressa.

Dla programistów motyw Twenty Twenty-One stanowi świetne źródło wiedzy o tym jak budować motywy z podejściem Gutenberg-First. Cały kod CSSCSS (Cascading Style Sheets) to język stylów używany do definiowania wyglądu i formatowania stron internetowych napisanych w języku HTML (HyperText Markup Language). CSS umożliwia oddzielenie treści strony internetowej od jej prezentacji, co pozwala na bardziej elastyczne i konsekwentne zarządzanie wyglądem witryny.  CSS pozwala na definiowanie różnych stylów, takich jak kolor, czcionka, rozmiar, odstępy, tła itp., dla różnych elementów HTML, takich jak nagłówki, akapity, tabele, linki. CSS umożliwia oddzielenie treści strony...Czym jest CSS? motywu oparty jest o zmienne CSS, dzięki czemu łatwo jest utrzymać spójność stylu wszystkich elementów na stronie, w tym m.in. bloków.

W kodzie źródłowym motywu znajdziemy też przykłady jak definiować własną paletę kolorów i gradientów, jak modyfikować niektóre ustawienia edytora blokowego, czy też jak tworzyć własne style i wzorce bloków.

Starter content

Myślałam, że to nowość w WordPressie 5.6, ale nie! Okazuje się, że możliwość tworzenia czegoś na zasadzie demo contentu dla motywów istnieje w WordPressie od 2016 roku! Jest to natywny mechanizm, który pozwala zainstalować motyw wraz z domyślną konfiguracją stron, wpisów, widgetów, menu itp.

Do tej pory spotykałam się wyłącznie z motywami, które posługiwały się własnymi wtyczkami do instalacji demo contentu. W motywie Twenty Twenty-One możemy podejrzeć jak umożliwić użytkownikom zainstalowanie WordPressa w takiej formie jak to wygląda na demo, bez korzystania z dodatkowych wtyczek.

Myślę, że dzięki możliwości użycia bloków do tworzenia layoutów strony, funkcjonalność starter content może niebawem doczekać się ciekawych implementacji ze strony twórców motywów.

Więcej na temat starter content można przeczytać na stronie https://make.wordpress.org/core/2016/11/30/starter-content-for-themes-in-4-7/.

WordPress 5.6 – nowości w edytorze blokowym

Edytor blokowy cały czas jest rozwijany, a poszczególne bloki rozszerzane o nowe funkcjonalności. W obecnym wydaniu WordPressa znajdziemy sporo drobnych zmian, na przykład:

• możliwość dodawania powtarzalnego wzoru jako tło dla bloku Okładka
• ustawiania tzw. sharp gradients w blokach, które obsługują kontrolkę do gradientów tła
• usprawnienie funkcjonalności Drag & Drop dla bloków, co poprawia dostępność edytora
• możliwość dodawania napisów do bloku video, kolejny krok to zwiększenia dostępności edytora blokowego
• możliwość zamiany przycisków z ikonami na przyciski tekstowe w interfejsie edytora – również dla lepszej dostępności
• filtrowanie wzorców po kategoriach
• dodano licznik znaków we wpisie
• i wiele innych drobnych usprawnień.

Ciekawsze nowości czekają natomiast programistów. 

Block APIAPI (Application Programming Interface) to zestaw reguł i narzędzi umożliwiających komunikację między różnymi aplikacjami. API to interfejs, który pozwala jednemu oprogramowaniu na korzystanie z funkcji innego oprogramowania, bez konieczności bezpośredniego dostępu do jego kodu źródłowego. API jest nieodzownym elementem nowoczesnych aplikacji, umożliwiając integrację różnych usług i systemów. Gdzie i kiedy można używać API? API jest szeroko stosowane w tworzeniu stron internetowych, aplikacji mobilnych oraz w integracji systemów IT. Na przykład,...Czym jest API? doczekało się wersji 2, dzięki której zyskujemy większą kontrolę nad strukturą DOM po stronie edytora blokowego. Jest to kolejny krok w kierunku odchudzania drzewa DOM w edytorze, aby miało taką samą strukturę jak na frontendzie.

Najciekawszą jednak nowością jest rozszerzenie Block Supports API o nowe elementy. Dzięki temu, w bardzo prosty sposób można dodać niektóre globalne kontrolki do naszego bloku. Są to m.in. color pickery dla koloru tekstu, tła i gradientu oraz wybór wielkości fontu i line height.

registerBlockType( 'cyberfolks/labs', {
    //pozostały kod
    supports: {
         fontSize: true,
         color: { 
             background: true,
             text: true
         },
    },
   //pozostały kod
} );

Zrobiłam szybki test. Do bloku, który tworzyliśmy podczas cyber_Laba na temat Gutenberga (nagranie na naszym kanale YouTube), dodałam powyższe linijki kodu i faktycznie nowe kontrolki pojawiły się i po prostu działają. To jest mega zmiana, która sprawia, że dodanie tych kontrolek jest obecnie dziecinnie proste. Wcześniej trzeba było posłużyć się komponentem wyższego rzędu, dodać kontrolki, a potem jeszcze obsłużyć interakcję użytkownika z tymi kontrolkami. W edytorze wygląda to tak:

WordPress 5.6 – automatyczne aktualizacje

W poprzednim wydaniu WordPressa otrzymaliśmy możliwość włączenia automatycznych aktualizacji wtyczek bezpośrednio z poziomu panelu admina. Wydanie 5.6 posuwa temat automatycznych aktualizacji jeszcze dalej. Mamy teraz możliwość włączenia auto-aktualizacji nawet dla większych wydań WordPressa. Do tej pory WordPress sam nam się aktualizował tylko w przypadku mniejszych aktualizacji.

Mało tego, dla nowych instalacji WordPressa, automatyczne aktualizacje są domyślnie włączone. Dla starszych instalacji sami musimy zaznaczyć odpowiednią opcję. W przeciwnym wypadku WordPress będzie nam się aktualizować tak jak wcześniej – czyli do mniejszych wydań lub zgodnie z naszymi customowymi ustawieniami. 

Jeśli więc nie chcemy na naszej stronie włączać automatycznych aktualizacji to nie musimy nic robić. Jeśli zdecydujemy się włączyć automatyczne aktualizowanie, to w panelu admina WordPressa musimy przejść do Kokpit->Aktualizacje i kliknąć w „Włącz automatyczne aktualizacje da każdej nowej wersji WordPressa”.

WordPress 5.6 – kompatybilność z PHP 8

O tym co nowego w wersji 8 języka PHPPHP - (Hypertext Preprocessor) to jeden z najpopularniejszych języków skryptowych, używany przede wszystkim po stronie serwera do tworzenia dynamicznych stron internetowych. Powstał w 1995 roku, a jego twórcą jest Rasmus Lerdorf. PHP cechuje się prostą składnią, dużą elastycznością oraz ogromną społecznością, która stale rozwija ten język. Dzięki temu PHP jest świetnym wyborem zarówno dla początkujących programistów, jak i zaawansowanych deweloperów tworzących rozbudowane aplikacje webowe. Jednym z głównych zastosowań PHP jest...Czym jest PHP? pisał niedawno na blogu Artur Pajkert, we wpisie „PHP 8 – co nowego?„. A czy WordPress 5.6 jest kompatybilny z PHP 8? Można powiedzieć, że jest, lecz kontrybutorzy pracujący nad dostosowaniem WordPressa 5.6 do PHP 8 określają tą kompatybilność frazą “beta compatibile”.

Oznacza to, że sporo pracy zostało włożone w dostosowanie WordPressa aby działał z PHP 8 i obecnie WordPress w wersji 5.6 przechodzi testy jednostkoweTesty jednostkowe to technika testowania oprogramowania, która polega na sprawdzaniu poszczególnych, najmniejszych jednostek kodu źródłowego, takich jak funkcje, metody czy klasy. Celem testów jednostkowych jest zapewnienie, że każda z tych jednostek działa zgodnie z oczekiwaniami. Dzięki temu można wcześniej wykryć i naprawić błędy, co przyczynia się do poprawy jakości całego systemu. Dlaczego warto stosować testy jednostkowe? Zwiększenie niezawodności: Testy jednostkowe pozwalają na szybkie wykrycie błędów w kodzie na wczesnym etapie tworzenia...Czym jest Testy jednostkowe?. Nie można tego jednak nazwać pełną kompatybilnością, ponieważ przeciętna instalacja WordPressa rzadko kiedy składa się z samego tylko rdzenia WordPressa. Jest to raczej cały ekosystem, na który składają się motyw i wtyczki, pochodzące od zewnętrznych wydawców.  Na chwilę obecną nie należy zakładać, że większość motywów i wtyczek jest kompatybilna z PHP 8. Tym samym nasza strona może nie działać poprawnie jeśli podniesiemy wersję PHP do 8 na serwerze.

Podsumowanie

W tym artykule starałam się zebrać kilka najciekawszych rzeczy, głównie z punktu widzenia użytkownika WordPressa. Z pełną listą zmian możesz zapoznać się we wpisie „WordPress 5.6 Field Guide„.

Nie ma tutaj rewolucji, większe zmiany w interfejsie wiszą jednak w powietrzu. Przyszły rok zapowiada się pod tym względem bardzo ekscytująco. Zobaczymy między innymi odświeżone ekrany widgetów i nawigacji – oparte w całości o edytor blokowy. Następnie pojawią się także nowe ekrany będące częścią tzw. Full Site Editing i Global Styles.