Îmbunătățirea experienței Drupal Layout Builder

Publicat: 2021-03-16

Când Layout Builder a fost introdus în Drupal 8.6 și stabilizat în Drupal 8.7, a creat o deviere în mecanismul de creare a paginii care este folosit în ecospațiul Drupal. Creatorul de aspect a dat o concurență dură altor instrumente precum Paragraphs, Brick, Panels și Display Suite. Capacitatea sa unică de a glisa și plasa componente și de a le previzualiza în timp real a fost o adevărată concesie pentru un instrument de creare a paginilor și pentru autori.

Cu toate acestea, în ciuda faptului că este un instrument prodigios pentru construirea de pagini, are deficiențe atunci când este utilizat pentru aplicații de întreprindere, care necesită o capacitate de creație mai bună, selecții restricționate, acces rapid și, mai important, permisiuni granulare pentru diferite roluri de utilizator.

În acest articol, voi acoperi 10 module contribuite de Drupal care pot fi utilizate împreună cu modulul genial Layout Builder, care va face instrumentul mai fascinant și mai autoritar. Pentru a adăuga la această minunatie, toate aceste module sunt compatibile și cu Drupal 9!

Drupal Layout Builder

Modulele sunt împărțite în anumite categorii:

  • Stil - Abilitatea de a oferi acces la editor pentru a alege dintr-o bibliotecă de stiluri care poate fi aplicată secțiunilor și blocurilor.
  • Experiență de autor - Îmbunătățiți experiența de creație a editorilor pe care îi vor iubi.
  • Reutilizabilitate - prevederea de a reutiliza componente sau secțiuni pe diferite pagini pentru a reduce timpul de construire a paginii.
  • Acces rapid - Oferiți acces rapid la editori pentru a efectua anumite acțiuni economisind astfel timp.
  • Permisiuni - Oferiți acces restricționat editorilor sau altor roluri de utilizator în funcție de accesul acestora.

Stiluri de constructor de aspect

Layout Builder Styles este un modul puternic Drupal care vă permite să adăugați stiluri la blocuri și secțiuni chiar din interfața de utilizare. Poate fi folosit pentru a oferi autorilor posibilitatea de a alege dintr-o listă de stiluri prestabilite definite în backend.

Captuseala mare

Un „stil” este doar o reprezentare a uneia sau mai multor clase CSS care vor fi aplicate. În plus, pentru blocuri, este adăugată o sugestie de șablon de bloc pentru stilul selectat.

Stilurile sunt practic entități de configurare care conțin clasele CSS. Clasele adăugate în configurație trebuie să fie definite în foaia de stil a temei de front-end pentru ca acestea să se reflecte pe front-end atunci când sunt aplicate la o anumită secțiune sau un bloc. Există o prevedere disponibilă pentru a avea mai multe stiluri care pot fi aplicate unui singur bloc sau secțiune.

Deoarece stilurile sunt stocate ca configurație, ele pot fi exportate cu ușurință în fișierele de configurare folosind managementul configurației Drupal.

Cu toate acestea, trebuie să fiți responsabil atunci când adăugați stiluri, deoarece oferiți autorilor o capacitate puternică de a modifica stilurile componentelor plasate într-o pagină. Dacă nu sunt planificate corect, lucrurile s-ar putea duce la sud cu stiluri contradictorii.

Atributele componentei Layout Builder

Modulul Atribute ale componentelor Layout Builder oferă autorilor o dispoziție similară, dar cu mai multe opțiuni și este doar pentru blocurile care sunt plasate într-un Layout.

Adăugați atribute

Adesea, autorii trebuie să adauge anumite atribute de date sau anumite clase/ID-uri CSS la un bloc pentru a reda datele într-un anumit mod. Există module disponibile pentru astfel de cazuri, cum ar fi atributele Block și clasa Block, dar le lipsește suportul Layout Builder sau necesită corecție pentru a funcționa. Modulul Atribute ale componentelor Layout Builder oferă opțiunile de a adăuga aceste detalii ca atribute la blocuri chiar în interfața de utilizare a Layout Builder.

Modulele oferă opțiuni ID, Clasă(e), Stiluri [stiluri inline la bloc], Atribute Data-*. Aceste atribute pot fi adăugate la 1) elementul bloc (exterior), 2) titlul blocului și 3) elementul conținut bloc (interior). Opțiunile sunt configurabile pentru fiecare tip de element, adică dacă nu doriți ca câmpul ID să fie disponibil pentru titlurile blocurilor, acestea pot fi debifate în formularul de configurare a modulelor la

„/admin/config/content/layout-builder-component-attributes”

Modal de constructor de aspect

Modulul Drupal Layout Builder Modal modernizează interfața de utilizare și experiența de creație pentru formularele de configurare a blocurilor sau formularele de creare (în cazul blocurilor inline). Formularul afișat în bara laterală de dialog în afara pânzei poate deveni foarte greoi deoarece este foarte îngust. Mai ales dacă aveți de-a face cu câmpuri complexe, câmpuri de text îmbogățit, referințe media etc. Dialogul off-canvas reduce foarte mult gradul de utilizare și nu este ideal pentru astfel de situații.

Adăugați bloc

Modulul deschide formularele într-o fereastră pop-up în care există o cantitate bună de spațiu de respirație și o utilizare crescută. Există configurații disponibile în care puteți seta lățimea și înălțimea ferestrei pop-up modale. De asemenea, puteți selecta ce temă să utilizați pentru conținutul modal, unde puteți alege fie temele activate implicit (Olivero în cazul capturii de ecran de mai sus) și vechea temă de administrare Seven. În prezent, Claro nu este acceptat, dar se lucrează în acest sens pentru a face Claro disponibil ca alternativă.

În general, modulul îmbunătățește foarte mult experiența de creație pentru editori și capacitatea de utilizare a Layout Builder.

Biblioteca Layout Builder

Să luăm în considerare o situație în care editorii trebuie să configureze rapid o pagină în care trebuie să arate anumite componente ale blocului de conținut pe baza anumitor criterii, de exemplu, selecția anumitor termeni taxonomii. Acum, acest lucru se poate face într-un mod greu, astfel încât editorii să creeze o pagină de destinație și apoi să creeze același aspect din nou și din nou pentru mai multe pagini cu același conținut, dar condiții diferite. Sau, utilizați modulul de bibliotecă Layout Builder.

Modulul Bibliotecă

Modulele de bibliotecă Layout builder oferă administratorului site-ului capacitatea de a crea machete predefinite pentru fiecare tip de entitate și combinație de pachet. Acum, aceste aspecte vor fi disponibile pentru editorii site-ului în timp ce creează conținutul paginii de destinație. Acest lucru va face sarcina mult mai ușoară și mai rapidă, unde editorii nu vor trebui să refacă aceeași sarcină în mod repetat. Modulul oferă, de asemenea, permisiuni granulare pentru a restricționa editorii să-și creeze propriile machete personalizate, dar le oferă posibilitatea de a personaliza machetele în funcție de articol.

Sectiunea Biblioteca

Similar cu situația menționată mai sus, în care editorii ar putea avea nevoie să aleagă dintr-un aspect existent dintr-o bibliotecă, poate exista o situație în care editorii vor trebui să refolosească anumite secțiuni din Layout Builder pe mai multe pagini. Aici intervine Biblioteca de secțiuni. Cu ajutorul modulului, editorii își pot crea propriile mini-aspecte pe care le pot reutiliza pe alte pagini. Acest lucru le permite să creeze pagini mai rapid, fără să facă din nou aceleași lucruri.

Biblioteca de șabloane

Diferența cheie dintre acest modul și modulul Layout Builder Library este că acesta din urmă creează un șablon de pagină completă și se bazează pe configurație. Biblioteca de secțiuni se bazează pe conținut, astfel încât editorul de conținut poate crea șabloane din mers fără configurații de import/export, de asemenea, creează șabloane pentru secțiuni sau mai multe secțiuni combinate (pagină).

Nu există suprapunere între cele două module și le puteți folosi pe ambele în același timp.

Layout Builder Direct Add

Una dintre caracteristicile cheie ale Layout Builder este capacitatea de a adăuga blocuri inline care sunt blocuri nereutilizabile specifice unei pagini. Acum, dacă paginile din sistemul dvs. depind în mare parte de aceste blocuri inline ca componente, Layout Builder Direct Add poate economisi ceva timp editorului salvând câteva clicuri.

Secțiunea Configurare

Modulul înlocuiește simplu butonul „Adăugați bloc” cu un buton derulant rapid la tipurile de bloc disponibile în sistem cu o opțiune „Mai multe” care deschide bara laterală de dialog off-canvas. Când un editor selectează oricare dintre tipurile de blocuri din listă, deschide direct formularul de bloc pentru a crea acea componentă.

Legătura de operare pentru generatorul de aspect

Acest mic modul este o caracteristică bună pentru un site. Pentru a accesa interfața de utilizare Layout Builder pentru o entitate, un editor trebuie să viziteze pagina și apoi să facă clic pe fila Layout din bara de activități. Link-ul de operare Layout Builder adaugă o opțiune Layout la butonul drop-down conținutului din pagina de prezentare generală a conținutului.

Afișează coloana

Opțiunea de aspect va apărea pentru toate pachetele de tip de entitate în care Layout Builder este activat. Acest link salvează editorilor de conținut un clic/încărcare de pagină atunci când doresc să acceseze pagina de aspect a unei entități direct, fără a încărca mai întâi pagina de editare a acesteia.

Restricții layout Builder

Din cutie, Layout Builder va enumera toate blocurile disponibile în sistem furnizate de diverse plugin-uri și module, câmpurile sunt disponibile ca blocuri și există opțiuni de blocuri inline pentru a crea blocuri unice. În afară de asta, toate aspectele furnizate de alte module și tema afișează, de asemenea, când este plasată o secțiune. Acest lucru poate fi puțin confuz și copleșitor pentru editori și reprezintă o problemă de utilizare, deoarece numărul de blocuri poate crește rapid într-o aplicație de întreprindere.

Restricții implicite

Layout Builder Restrictions rezolvă această problemă, oferind un aspect configurabil cu opțiunile necesare. Aceste opțiuni vor fi prezente ori de câte ori Layout Builder este activat pentru orice afișare de entitate. Interfața de utilizare configurabilă pentru modul pentru blocuri și machete de listare autorizată/refuzată. Site-urile pot permite toate opțiunile de la un anumit furnizor sau pot restricționa toate opțiunile de la furnizor sau pot specifica blocuri și aspecte individuale permise. Administratorii site-ului pot permite/nega acele blocuri care sunt utile pentru editori pentru a construi paginile și numai acele blocuri și machete vor fi disponibile din care editorii pot alege.

Permisiuni avansate pentru Layout Builder

Deși Drupal oferă un sistem de permisiuni puternic pentru rolurile de utilizator, pot exista posibilități de permisiuni mai granulare bazate pe roluri. Situația poate apărea atunci când există mai multe roluri de utilizator care interacționează cu sistemul și paginile.

Permisiuni avansate

Modulul Permisiuni avansate Layout Builder oferă administratorilor site-ului această capacitate de a oferi permisiuni limitate de utilizare în funcție de rolul lor. Aceste permisiuni sunt globale și sunt aplicate pentru toate tipurile de entități în care Layout Builder este activat. Pentru a duce lucrurile mai departe și a restricționa accesul la un nivel mai brut, blocarea constructorului Layout va fi utilă, care va fi tratată în secțiunea următoare.

Layout Builder Lock

După cum sa menționat mai sus, Layout Builder Lock va oferi utilizatorilor un acces mai brut. Permite administratorilor să blocheze secțiuni ale unui aspect implicit, astfel încât utilizatorii să nu poată efectua anumite acțiuni atunci când înlocuiesc aspectul pentru o entitate individuală.

Etichetă administrativă

Aceste setări de blocare vor fi disponibile când modulul este instalat și vor fi disponibile pentru toate secțiunile. Există permisiuni globale disponibile pentru a gestiona accesul la funcțiile de blocare. Acestea sunt caracteristici editoriale avansate care ar trebui adăugate și utilizate foarte responsabil. Blocarea unei secțiuni sau a oricărei componente din interiorul unei secțiuni înseamnă că secțiunea va avea acces foarte limitat pentru schimbare.

Recapitulare rapidă

  1. Stiluri de generator de aspect - permiteți constructorilor de site-uri să aleagă dintr-o listă de stiluri pentru a le aplica blocurilor de constructor de aspect și secțiunilor de constructor de aspect.
  2. Atributele componentelor Layout Builder - le permite editorilor să adauge atribute HTML la componentele (blocuri) Layout Builder.
  3. Layout Builder Modal - vă permite să adăugați și să configurați blocuri existente într-un modal în UI Layout Builder.
  4. Bibliotecă pentru constructor de machete - oferă o bibliotecă de machete care le permite editorilor de conținut să aleagă dintr-o listă de machete predefinite.
  5. Bibliotecă de secțiuni - creați șabloane reutilizabile pentru secțiuni individuale sau multiple.
  6. Layout Builder Direct Add - înlocuiește linkul „Adăugați bloc” cu un buton drop-down care listează tipuri de blocuri personalizate.
  7. Link de operare Layout Builder - adaugă un link de operare „Layout” la conținutul activat de Layout Builder pe paginile administrative Drupal.
  8. Restricții pentru Layout Builder - setați ce blocuri și ce aspecte ar trebui să fie disponibile pentru plasare în Layout Builder.
  9. Layout Builder Advanced Permissions - permite controlul în detalii a accesului la pagina Layout Builder prin furnizarea unui set de permisiuni mai granular.
  10. Layout Builder Lock - permite administratorilor să blocheze secțiuni ale unui aspect implicit, astfel încât utilizatorii să nu poată efectua anumite acțiuni atunci când înlocuiesc aspectul pentru o entitate individuală.