Gutenberg 8.3 actualizează categoriile de blocuri, include selectorul de blocuri părinte și adaugă noi comenzi de design

Publicat: 2020-06-13

Ieri, echipa Gutenberg a lansat versiunea 8.3 a pluginului aflat în desfășurare din spatele editorului de blocuri. Deși o mare parte din atenția echipei se concentrează pe viitoarea editare a site-ului complet, această actualizare include mai multe funcții orientate spre utilizator, cum ar fi un set reorganizat de categorii de blocuri, un selector de blocuri părinte, un control de spațiere și opțiuni de culoare pentru linkuri.

O îmbunătățire mai mică include abilitatea de a filtra blocul Ultimele postări în funcție de autor. S-a schimbat și controlul nivelului pentru blocul Heading. În loc să selectați nivelul în bara laterală de opțiuni de bloc, selectorul de nivel este acum situat în bara de instrumente a editorului.

În Gutenberg 8.2, apăsând tasta Enter în câmpul de legendă pentru un bloc de imagine a creat un nou paragraf. În 8.3, această caracteristică a fost extinsă la toate blocurile cu subtitrări.

Echipa a corectat peste 20 de erori remediate în cea mai recentă versiune. În general, noua actualizare a pluginului pare să fie solidă după o zi de utilizare. Cu toate acestea, unele dintre completările experimentale, cum ar fi noul control de umplutură, ar putea merita îngrijorare. Autorii temelor trebuie să înceapă să testeze acest lucru, să ofere feedback și să se asigure că dezvoltarea se îndreaptă în direcția corectă.

Categorii de blocuri noi

Captură de ecran a dispozitivului de inserare a blocurilor Gutenberg.
Noua categorie „Design” în insertorul de blocuri.

Echipa Gutenberg a redenumit și reorganizat categoriile de bloc. Noua listă pare să aibă mai mult sens și este mai bine consolidată în grupuri adecvate:

  • Text
  • Mass-media
  • Proiecta
  • Widgeturi
  • Încorporează

Deși sunt un fan al noilor nume de categorii, consider că categoriile sunt inutile pentru orice scop practic în acest moment. De când Gutenberg a renunțat la interfața cu file în dispozitivul de inserare a blocurilor, sa simțit ca un zid mare de blocuri. Ochii mei trec în mod natural după numele categoriilor pe măsură ce derulez și defilez și parcurg lista de blocuri disponibile pentru a găsi acel bloc anume de care am nevoie. Aproape întotdeauna folosesc comenzi slash de la tastatură pentru inserarea blocurilor. În acele cazuri în care nu o fac, nu este o experiență de utilizator ideală, iar noile categorii nu ajută prea mult.

Selectați Blocul părinte

Trecând cu mouse-ul peste bara de instrumente a editorului pentru a găsi selectorul de blocuri părinte.
Trecând cu mouse-ul peste bara de instrumente pentru a găsi selectorul de blocuri părinte.

Una dintre cele mai frustrante experiențe din Gutenberg este încercarea de a selecta un bloc părinte într-un scenariu de bloc imbricat. Mult prea des, utilizatorii simt că fac clic la întâmplare, în speranța că vor ajunge în acel punct favorabil în care pot de fapt să navigheze la blocul pe care trebuie să îl editeze. Este un exercițiu de frustrare în cele mai bune momente.

Echipa Gutenberg a făcut un pas - un pas mic - spre atenuarea acestei dureri. Când treceți cu mouse-ul peste butonul „modificați tipul sau stilul blocului” din bara de instrumente a editorului, apare un nou buton pentru a selecta blocul părinte.

Nu sunt sigur dacă acesta este modul corect de a rezolva problema. Aș dori să văd câteva experimente cu un fel de buton săgeată care apare fără să treacă cu mouse-ul. Deocamdată, sunt mulțumit că echipa încearcă să rezolve problema și sper că iterațiile viitoare îmbunătățesc navigarea în blocurile imbricate.

Această caracteristică nu pare să funcționeze când modul bară de instrumente de sus este activat. Pentru cei care folosesc acest mod, cea mai bună modalitate de a selecta un bloc părinte este prin intermediul navigației din partea de jos a editorului.

Controlul de spațiere/dapă experimentală

Utilizarea noului control de umplutură pentru blocul Cover.
Adăugarea de umplutură personalizată la un bloc Cover.

Autorii temei pot adăuga acum suport pentru un control experimental de umplutură prin add_theme_support( 'experimental-custom-spacing' ) . Când este acceptat, utilizatorul final va vedea o nouă filă Spațiere sub bara laterală de opțiuni de bloc pentru blocul Cover, care ar trebui să fie disponibilă pentru alte blocuri în viitor. În mod implicit, utilizatorii pot controla umplutura pentru toate cele patru laturi ale unui bloc cu o singură valoare. De asemenea, pot „deconecta” padding-ul și pot controla individual valorile de sus, jos, stânga și dreapta.

Probabil că echipa Gutenberg va extinde această funcție de spațiere pentru a include și un control al marjei. Ar fi mișcarea naturală și una în care sper că va duce la moartea blocului Spacer cu care utilizatorii au trebuit să trăiască în ultimii doi ani.

Cu toate acestea, nu sunt vândut să permit utilizatorilor finali să controleze umplutura cu valori explicite. Schimbarea întâmplătoare a valorilor de umplutură va rupe ritmul vertical pe care mulți autori de teme își fac timp să îl calculeze meticulos. Când folosesc valorile pixelilor (implicit), utilizatorii vor întâmpina cu siguranță probleme cu dimensiunile ecranului tabletei și mobile. În esență, va crea o mizerie completă de spațiere.

Nu sunt împotriva ideii. Vreau să se facă chiar înainte de a ajunge în WordPress. Autorii de teme ar trebui să poată înregistra clase cu nume care sunt gestionate prin foaia de stil. Acest lucru se întoarce la ideea ca WordPress să aibă un cadru de design. Creați un set de clase de utilitate pentru spațiere (oh, salut, Tailwind). Lăsați autorii temei să definească spațierea pe baza designului lor. Lăsați utilizatorii să aleagă dintre acestea. Apoi, oferiți o opțiune personalizată pentru acele momente în care utilizatorii doresc să ia problemele în propriile mâini. În acel moment, au luat o decizie explicită de a se rupe de fluxul de design pe care autorul temei l-a ales.

Link Culori

Selectarea unei culori pentru link în editorul de blocuri.
Selectarea unei culori personalizate pentru link.

Unul dintre obstacolele mai grele pe care au trebuit să le înfrunte autorii de teme atunci când modelează pentru editorul de blocuri este să afle ce să facă cu culorile linkurilor atunci când utilizatorul schimbă culoarea de fundal a unui bloc. Utilizatorii au avut de mult controlul asupra culorii textului în acel scenariu. Cu toate acestea, culorile linkurilor ar putea deveni rapid inaccesibile sau pur și simplu de-a dreptul urâte. Autorii de teme cu gândire înainte ar stila acele culori de link astfel încât să moștenească culoarea textului, dar aceasta nu este întotdeauna soluția ideală.

Aici intervin culorile linkurilor controlate de utilizator. Pentru a adăuga suport pentru culorile linkurilor personalizate, autorii temei trebuie să opteze pentru această funcție prin add_theme_support( 'experimental-link-color' ) . Aceasta va adăuga un nou selector de culoare pentru blocurile Paragraf, Titlu, Grup, Coloane și Media și Text.

În imposibilitatea de a face această funcție să funcționeze cu apelul funcției de suport pentru tema, a trebuit să caut puțin în cod pentru a găsi problema. Pentru ca autorii de teme să adauge suport pentru culorile linkurilor, ar trebui să-și definească și linkurile implicite, așa cum se arată în următorul fragment de cod CSS:

 a { color: var( --wp--style--color--link, #000 ); }

WordPress va seta automat --wp--style--color--link . Pentru mai multă specificitate, autorii temei pot viza și .has-link-color a .