Proiectarea temelor copii WordPress bazate pe blocuri cu un singur fișier JSON

Din momentul în care mi-am deschis primul magazin de teme în 2008 și până în prezent, ca o persoană care doar chinuia, planul meu a fost întotdeauna să construiesc o singură temă în modelul CSS Zen Garden. Acesta a fost un proiect pe care Dave Shea l-a lansat la începutul anilor 2000 pentru a arăta modul în care designerii puteau manipula un site numai prin CSS. HTML-ul ar rămâne același, dar designul ar putea fi orice.

Am atins acest obiectiv de mai multe ori cu mai multe proiecte. Din punct de vedere tehnic, tot ce am avut nevoie a fost un marcaj de sunet arhitectural într-o temă WordPress și CSS personalizat într-o temă copil.

Conceptul a fost simplu, dar în timp, viziunea mea s-a schimbat. Am vrut să creez ceva care să facă proiectarea acestor tipuri de teme pentru copii și mai ușoară. Prin urmare, am construit sisteme personalizate pentru a rezolva lipsa de instrumente WordPress în domeniul designului temelor. Ca să nu mă laud prea mult, dar am simțit că am creat niște metode la îndemână. Au permis designerilor de teme pentru copii să introducă valori în fișierele de configurare, cum ar fi numele familiei de fonturi și codurile de culoare. Cele mai multe dintre acestea ar putea fi, de asemenea, suprascrise de utilizatorii finali prin intermediul personalizării.

Până în 2018, lucram deja din greu la ceea ce ar fi opusul meu magistral, cea mai bună temă WordPress pe care am construit-o vreodată. De asemenea, plănuisem să fie ultimul meu. Mă gândeam să ies din joc de ceva vreme. Dar acesta a fost un proiect pe care trebuia să-l duc la bun sfârșit.

Apoi, noul editor de blocuri a aruncat totul în aer. Lucram cu el luni de zile înainte de a fi lansat, dar știam că dezvoltarea temei nu va mai fi niciodată la fel. Proiectul Gutenberg va continua să se maturizeze și să remodeleze viitorul WordPress.

În cele din urmă mi-am lansat tema. A fost unul dintre cele mai vechi produse comerciale care a susținut noul sistem de blocuri. Totuși, am fost și dezumflat.

Acestea au fost primele zile ale editorului de blocuri. Nimeni nu știa cu adevărat la ce ne vom uita în trei sau mai mulți ani, dar dacă ai acorda o atenție minimă, puteai vedea că tematica va evolua în ceva cu mult diferit decât era la acea vreme. Am petrecut peste un an construind un sistem de tematică care să devină irelevant în scurt timp - desigur, am crezut că am fi ajuns la această destinație mult mai devreme.

WordPress 5.9 va livra subcomponentele finale ale Editării complete a site-ului. Aceasta va include suport pentru temele bloc sub capotă. Utilizatorii care le instalează le pot personaliza prin intermediul editorului de site și al interfeței de stiluri globale.

Ceea ce mă entuziasmează cel mai mult este tot ceea ce mă trezea în fiecare dimineață în urmă cu 13 ani: temele copiilor.

Temele de blocare copii au funcționat parțial în pluginul Gutenberg de luni de zile. Cu toate acestea, funcția pe care o așteptam cel mai mult nu a fost gata până acum o săptămână. Un nou patch permite unei teme secundare să suprascrie valori individuale ale fișierului theme.json al părintelui. În esență, cele două fișiere sunt îmbinate, copilul având prioritate.

De ce am fost atât de entuziasmat de această funcție? Pentru că era același sistem pe care l-am construit în anii trecuți, dar mai bun.

După ce am văzut acest teren în versiunea de dezvoltare a lui Gutenberg, primul lucru pe care l-am făcut a fost să încarc o temă personalizată cu care m-am distrat. Este un proiect pe care l-am construit pentru distracție și pentru propria mea edificare.

Apoi, am creat un nou proiect în editorul meu de cod. Am adăugat fișierul style.css necesar și am conectat câmpurile de antet corespunzătoare. Nu aș avea nevoie de ea dincolo de asta. Designul temei copilului meu s-ar baza pe o altă caracteristică cu totul.

Am adăugat un theme.json la nivelul rădăcină al temei copil și am început să mă distrez mai mult decât am avut cu tematica de mult timp.

Am ales câteva culori de toamnă și un font de titlu distractiv. În câteva minute, am avut un nou strat de vopsea stropit pe instalarea mea de testare. Designul nu a fost revoluționar sau ceva de genul. Am fost doar uimit de cât de ușor a fost să-mi transform designul introducând câteva valori.

Acesta este tipul de tematică pentru copii după care mi-am dorit mereu. Îmi doresc puterea de a schimba elementele de design ale temei mele pentru diferite anotimpuri și sărbători. Și vreau să pot împărtăși cu alții aceste teme ale copiilor.

După cum am spus, am mai construit astfel de metode de tematică pentru copii (am folosit PHP în loc de JSON). Cu toate acestea, acesta este mult mai puternic, deoarece se bazează pe sistemul de blocuri standard și nu pe ceva personalizat pe care doar o mână de oameni l-ar folosi vreodată.

Unii dintre voi ar putea întreba de ce nu am făcut aceste modificări prin intermediul editorului site-ului în loc să creez o temă copil. Rich Tabor a pus, în esență, aceeași întrebare pe Twitter mai devreme astăzi. „Dacă o temă constă din șabloane JSON și bloc care pot fi modificate ambele prin Stiluri globale, atunci pentru ce sunt temele copil?”

Să spunem că am instalat o temă bloc și am făcut câteva ajustări de culoare. Acum, pretindeți-vă că vreau să amestec acest lucru când se va rostogoli Crăciunul - introduceți câteva culori și găsiți un font festiv de sărbătoare. Când fac aceste modificări, vechiul meu design nu va mai fi acolo când se termină sezonul, deoarece personalizările utilizatorilor sunt stocate pe baza temei active. Aș putea, desigur, să notez toate setările mele vechi și să le schimb pe toate înapoi mai târziu. Cu toate acestea, a face acest lucru printr-o temă copil înseamnă că pot doar să schimb temele în orice moment. Vechile mele setări ar rămâne intacte.

Poate că acesta este foarte mult un caz marginal. Cine face modificări sezoniere designului lor în aceste zile, nu?

Partea interesantă este că pot partaja cu alții temele copil create cu un singur fișier JSON.

Tematica pentru copii a fost o pasiune a mea de când funcția a ajuns în WordPress. În unele privințe, nu s-a schimbat prea mult. Tematicii pot suprascrie în continuare șabloanele de la părinte. Ei pot continua să adauge CSS personalizat dacă doresc. Dar acum, ei pot configura orice parte a designului dintr-un singur fișier standardizat. Este ceva pentru care merită să pun din nou capacul de dezvoltator și să construiesc încă o temă.

De asemenea, văd un viitor fără tematică pentru copii, care are în continuare aceleași beneficii ale partajării elementelor de design.

Directorul cu modele de bloc oferă deja aspecte care ar trebui să funcționeze cu orice temă WordPress bine construită. Cu toate acestea, există și alte componente ale designului pe care le-am putea descompune în viitor.

Îmi imaginez un viitor în care WordPress ar putea avea palete de culori instalabile precum ceea ce oferă Color Lovers. Doar răsfoiți un director, instalați și schimbați schema de culori fără a găsi o temă nouă. Ceva similar cu recentul plugin Adrian ar putea servi aceluiași scop pentru fonturi. Acestea sunt lucruri pe care comunitatea ar putea dori să le ia în considerare în viitor. Nicio idee nu ar trebui să fie exclusă de la masă în acest moment.

Deocamdată, mă bucur că am toată puterea tematică pentru copii la dispoziție. Schimbarea ar trebui să ajungă în Gutenberg 11.8 în această săptămână și WordPress 5.9 mai târziu în acest an.