Miglioramento dell'esperienza di creazione di layout di Drupal
Pubblicato: 2021-03-16Quando Layout Builder è stato introdotto in Drupal 8.6 e stabilizzato in Drupal 8.7, ha creato una deriva nel meccanismo di creazione delle pagine utilizzato nell'ecospace di Drupal. Il costruttore di layout ha dato una forte concorrenza ad altri strumenti come paragrafi, mattoni, pannelli e Display Suite. La sua capacità unica di trascinare e rilasciare i componenti e visualizzarli in anteprima in tempo reale è stata una vera concessione per uno strumento di creazione di pagine e per gli autori.
Tuttavia, nonostante sia uno strumento prodigioso per la creazione di pagine, ha i suoi difetti quando viene utilizzato per applicazioni aziendali che richiedono una migliore capacità di creazione, selezioni limitate, accesso rapido e, soprattutto, autorizzazioni granulari per diversi ruoli utente.
In questo articolo tratterò 10 moduli di Drupal che possono essere utilizzati insieme al brillante modulo Layout Builder che renderà lo strumento più affascinante e autorevole. Per aggiungere a questa meraviglia, tutti questi moduli sono compatibili anche con Drupal 9!

I moduli sono suddivisi in alcune categorie:
- Stile - Possibilità di fornire accesso all'editor per scegliere da una libreria di stili che può essere applicata a sezioni e blocchi.
- Esperienza di creazione : migliora l'esperienza di creazione degli editor che adoreranno.
- Riutilizzabilità - Possibilità di riutilizzare componenti o sezioni su pagine diverse per ridurre i tempi di creazione della pagina.
- Accesso rapido : fornisce un accesso rapido agli editor per eseguire determinate azioni, risparmiando così tempo.
- Autorizzazioni : concedere un accesso limitato agli editor o ad altri ruoli utente in base al loro accesso.
Stili di creazione layout
Il Layout Builder Styles è un potente modulo Drupal che ti consente di aggiungere stili ai blocchi e alle sezioni direttamente dall'interfaccia utente. Può essere utilizzato per fornire agli autori la possibilità di scegliere da un elenco di stili preimpostati definiti nel backend.

Uno "stile" è solo una rappresentazione di una o più classi CSS che verranno applicate. Inoltre, per i blocchi, viene aggiunto un suggerimento di modello di blocco per lo stile selezionato.
Gli stili sono fondamentalmente entità di configurazione che contengono le classi CSS. Le classi che vengono aggiunte nella configurazione devono essere definite nel foglio di stile del tema frontend affinché si riflettano sul frontend quando vengono applicate a una particolare sezione o blocco. È disponibile una disposizione per avere più stili che possono essere applicati a un singolo blocco o sezione.
Poiché gli stili sono archiviati come configurazione, possono essere facilmente esportati in file di configurazione utilizzando la gestione della configurazione di Drupal.
Tuttavia, devi essere responsabile durante l'aggiunta di stili poiché stai dando una potente capacità agli autori di alterare gli stili dei componenti che vengono inseriti in una pagina. Se non pianificato correttamente, le cose potrebbero andare male con stili contrastanti.
Attributi dei componenti del generatore di layout
Il modulo Attributi dei componenti di Layout Builder fornisce una disposizione simile agli autori ma con più opzioni ed è solo per i blocchi che vengono inseriti in un layout.

Spesso, gli autori devono aggiungere determinati attributi di dati o determinate classi/ID CSS a un blocco per rendere i dati in un certo modo. Sono disponibili moduli per casi come gli attributi Block e la classe Block, ma non hanno il supporto di Layout Builder o necessitano di patch per funzionare. Il modulo Attributi dei componenti di Layout Builder offre le opzioni per aggiungere questi dettagli come attributi ai blocchi direttamente nell'interfaccia utente di Layout Builder immediatamente.
I moduli forniscono opzioni ID, Class(es), Styles [stili in linea al blocco], Data-* attributi. Questi attributi possono essere aggiunti a 1) l'elemento del blocco (esterno), 2) il titolo del blocco e 3) l'elemento del contenuto del blocco (interno). Le opzioni sono configurabili per ogni tipo di elemento cioè se non vuoi che il campo ID sia disponibile per i titoli dei blocchi questi possono essere deselezionati nel modulo di configurazione dei moduli in
“/admin/config/content/layout-builder-component-attributes”
Modale generatore di layout
Il modulo Modale Layout Builder di Drupal modernizza l'interfaccia utente e l'esperienza di creazione per i moduli di configurazione dei blocchi oi moduli di creazione (in caso di blocchi in linea). Il modulo visualizzato nella barra laterale della finestra di dialogo fuori dalla tela può diventare davvero ingombrante perché è molto stretto. Soprattutto se hai a che fare con campi complessi, rich text, riferimenti multimediali, ecc. La finestra di dialogo off-canvas riduce notevolmente l'usabilità e non è l'ideale per tali situazioni.

Il modulo apre i moduli in una finestra popup in cui c'è una buona quantità di spazio per respirare e una maggiore usabilità. Sono disponibili configurazioni in cui è possibile impostare la larghezza e l'altezza della finestra popup modale. Puoi anche selezionare quale tema utilizzare per il contenuto modale in cui puoi scegliere i temi abilitati predefiniti (Olivero nel caso dello screenshot sopra) e il buon vecchio tema di amministrazione Seven. Attualmente, Claro non è supportato, ma su questo fronte si sta lavorando per rendere Claro disponibile come alternativa.
Nel complesso, il modulo migliora notevolmente l'esperienza di creazione per gli editor e l'usabilità di Layout Builder.
Libreria per la creazione di layout
Consideriamo una situazione in cui gli editor devono impostare rapidamente una pagina in cui devono mostrare determinati componenti del blocco di contenuto in base a determinati criteri, ad esempio la selezione di particolari termini di tassonomia. Ora, questo può essere fatto in modo difficile che gli editor creino una landing page e poi creino lo stesso layout ancora e ancora per più pagine con lo stesso contenuto ma condizioni diverse. Oppure, usa il modulo libreria Layout Builder.

I moduli della libreria Layout builder forniscono all'amministratore del sito la capacità di creare layout predefiniti per ogni tipo di entità e combinazione di bundle. Ora, questi layout saranno disponibili per gli editori del sito durante la creazione del contenuto della pagina di destinazione. Ciò renderà l'attività molto più semplice e veloce in cui gli editori non dovranno ripetere ripetutamente la stessa attività. Il modulo fornisce anche autorizzazioni granulari per limitare gli editor a creare i propri layout su misura, ma dà loro la possibilità di personalizzare i layout in base al contenuto.
Biblioteca di sezione
Simile alla situazione sopra menzionata in cui gli editor potrebbero dover scegliere da un layout esistente da una libreria, ci può essere una circostanza in cui gli editor dovranno riutilizzare determinate sezioni da Layout Builder su più pagine. È qui che entra in gioco la Biblioteca delle sezioni. Con il modulo, gli editor possono creare i propri mini layout che possono riutilizzare su altre pagine. Ciò consente loro di creare pagine più velocemente senza ripetere le stesse operazioni.


La differenza fondamentale tra questo modulo e il modulo Libreria del generatore di layout è che quest'ultimo crea un modello a pagina intera ed è basato sulla configurazione. La libreria di sezioni è basata sui contenuti, quindi l'editor di contenuti può creare modelli al volo senza importare/esportare configurazioni, inoltre crea modelli per la sezione o più modelli di sezioni combinate (pagina).
Non c'è sovrapposizione tra i due moduli e puoi usarli entrambi contemporaneamente.
Aggiunta diretta di Layout Builder
Una delle caratteristiche chiave di Layout Builder è la possibilità di aggiungere blocchi in linea che sono blocchi non riutilizzabili specifici per una pagina. Ora, se le pagine nel tuo sistema dipendono principalmente da questi blocchi in linea come componenti, l'aggiunta diretta di Layout Builder può far risparmiare tempo all'editor risparmiando pochi clic.

Il modulo sostituisce semplicemente il pulsante "Aggiungi blocco" con un pulsante a discesa rapido ai tipi di blocco disponibili nel sistema con un'opzione "Altro" che apre la barra laterale della finestra di dialogo fuori dalla tela. Quando un editor seleziona uno dei tipi di blocco dall'elenco, apre direttamente il modulo del blocco per creare quel componente.
Link per l'operazione del generatore di layout
Questo piccolo modulo è una buona funzionalità per un sito. Per accedere all'interfaccia utente di Layout Builder per un'entità, un editor deve visitare la pagina e quindi fare clic sulla scheda Layout nella barra delle applicazioni. Il collegamento all'operazione del generatore di layout aggiunge un'opzione di layout il pulsante a discesa ai contenuti nella pagina di panoramica dei contenuti.

L'opzione di layout verrà visualizzata per tutti i bundle di tipi di entità in cui è abilitato Layout Builder. Questo collegamento consente agli editor di contenuti di risparmiare un clic/caricamento della pagina quando desiderano accedere direttamente alla pagina di layout di un'entità senza prima caricare la sua pagina di modifica.
Restrizioni del Generatore di layout
Immediatamente, Layout Builder elencherà tutti i blocchi disponibili nel sistema forniti da vari plug-in e moduli, i campi sono disponibili come blocchi e ci sono opzioni di blocchi in linea per creare blocchi una tantum. A parte questo, tutti i layout forniti da altri moduli e il tema elencano anche quando viene posizionata una sezione. Questo può essere un po' confuso e opprimente per gli editor e pone un problema di usabilità poiché il numero di blocchi può crescere rapidamente in un'applicazione aziendale.

Restrizioni di Layout Builder risolve questo problema fornendo un layout configurabile con le opzioni necessarie. Queste opzioni saranno presenti ogni volta che Layout Builder è abilitato per la visualizzazione di qualsiasi entità. L'interfaccia utente configurabile del modulo per blocchi e layout di elenco consentiti/negati. I siti possono consentire tutte le opzioni di un determinato provider o limitare tutte le opzioni in base al provider o specificare singoli blocchi e layout consentiti. Gli amministratori del sito possono consentire/negare quei blocchi che sono utili agli editor per creare le pagine e solo quei blocchi e layout saranno disponibili per gli editor tra cui scegliere.
Permessi avanzati di Layout Builder
Sebbene Drupal fornisca un potente sistema di autorizzazioni per i ruoli utente, possono esserci possibilità di autorizzazioni più granulari basate sui ruoli. La situazione può verificarsi quando più ruoli utente interagiscono con il sistema e le pagine.

Il modulo Permessi avanzati di Layout Builder offre questa capacità agli amministratori del sito di fornire autorizzazioni limitate da utilizzare in base al loro ruolo. Queste autorizzazioni sono globali e vengono applicate a tutti i tipi di entità in cui è abilitato Layout Builder. Per andare oltre e limitare l'accesso a un livello più rozzo, sarà utile il blocco del generatore di layout, che verrà trattato nella sezione successiva.
Blocco del generatore di layout
Come accennato in precedenza, il blocco del Generatore di layout fornirà un accesso più grezzo per gli utenti. Consente agli amministratori di bloccare le sezioni di un layout predefinito in modo che gli utenti non possano eseguire determinate azioni durante l'override del layout per una singola entità.

Queste impostazioni di blocco saranno disponibili al momento dell'installazione del modulo e saranno disponibili per tutte le sezioni. Sono disponibili autorizzazioni globali per gestire l'accesso alle funzionalità di blocco. Queste sono funzionalità editoriali avanzate che dovrebbero essere aggiunte e utilizzate in modo molto responsabile. Bloccare una sezione o qualsiasi componente all'interno di una sezione significa che la sezione avrà un accesso molto limitato per la modifica.
Riepilogo veloce
- Stili del generatore di layout: consente ai costruttori di siti di selezionare da un elenco di stili da applicare ai blocchi del generatore di layout e alle sezioni del generatore di layout.
- Attributi dei componenti di Layout Builder : consente agli editor di aggiungere attributi HTML ai componenti (blocchi) di Layout Builder.
- Layout Builder modale : consente di aggiungere e configurare i blocchi esistenti in modo modale nell'interfaccia utente di Layout Builder.
- Libreria generatore di layout : fornisce una libreria di layout che consente agli editor di contenuti di scegliere da un elenco di layout predefiniti.
- Libreria di sezioni : crea modelli riutilizzabili per sezioni singole o multiple.
- Aggiunta diretta di Layout Builder : sostituisce il collegamento "Aggiungi blocco" con un pulsante a discesa che elenca i tipi di blocco personalizzati.
- Collegamento all'operazione di Layout Builder : aggiunge un collegamento all'operazione "Layout" al contenuto abilitato a Layout Builder nelle pagine amministrative di Drupal.
- Restrizioni del Generatore di layout : imposta quali blocchi e quali layout devono essere disponibili per il posizionamento in Generatore di layout.
- Permessi avanzati di Layout Builder : consente di controllare in dettaglio l'accesso alla pagina Layout builder fornendo un set di autorizzazioni più granulare.
- Blocco del generatore di layout : consente agli amministratori di bloccare le sezioni di un layout predefinito in modo che gli utenti non possano eseguire determinate azioni quando sovrascrivono il layout per una singola entità.
