Cosa devi sapere sulla directory dei modelli di WordPress

Pubblicato: 2021-08-26

Alla fine dell'anno scorso ho scritto una guida completa su cosa fossero i pattern di WordPress, a cosa servissero e come crearli e usarli nell'editor di blocchi di WordPress. In poco più di sei mesi, grazie al lavoro dietro l'intera community di WordPress, ci sono stati grandi progressi nello sviluppo dei pattern a blocchi. Vediamo come dopo la pubblicazione della versione 5.8 di WordPress, la sua disponibilità e utilizzo stiano crescendo rapidamente. Per questo motivo, penso che sia interessante essere aggiornati sulla Pattern Directory di WordPress, poiché influenzerà il modo in cui riprogetteremo le nostre pagine e i nostri temi in futuro.

Come abbiamo già commentato in precedenza, un pattern di blocco è un insieme di sezioni o frammenti predefiniti costituiti da un gruppo di blocchi che puoi utilizzare nella creazione di pagine e post. Questi design possono essere qualcosa di semplice come una sezione che mostra due pulsanti o una sezione di prezzo con design appariscenti e complessi.

Inserisci e modifica i modelli di blocco

Inserire un modello di blocco dall'editor di blocchi è facile come aggiungere un blocco qualsiasi. Dopo aver fatto clic sull'icona + nell'angolo in alto a sinistra dell'editor, viene visualizzata una finestra di dialogo a comparsa con la quale è possibile aggiungere blocchi, motivi o altri elementi riutilizzabili.

Inserimento di uno schema di blocco nell'editor di WordPress
Cerca un modello di blocco nell'editor di WordPress.

Nella scheda Patterns troverai un menu a tendina dove puoi selezionare per categoria i pattern da cercare. Alcuni dei modelli che troverai vengono forniti per impostazione predefinita con WordPress, altri sono specifici del tema che hai installato e alcuni proverranno dai tuoi plug-in. In effetti, ci sono molti plugin che aggiungeranno una serie completamente nuova di bellissimi modelli!

Una volta selezionato uno schema, l'insieme di blocchi che lo compongono viene automaticamente aggiunto al tuo post o alla tua pagina. Tutto quello che devi fare ora è modificarlo in modo che contengano il contenuto che desideri.

Modifica di uno dei blocchi che formano un pattern
Modifica di uno dei blocchi che formano un pattern.

Copia e incolla dalla directory dei modelli di WordPress

Alla fine di aprile 2021, WordPress ha pubblicato la Pattern Directory su WordPress.org. Al momento della stesura di questo post, non c'è (23 agosto 2021) una voce di menu in WordPress.org per navigare direttamente a questa pagina. Almeno, non ce n'è in inglese, perché ce n'è uno in spagnolo.

Directory dei modelli su WordPress.org
Directory dei modelli su WordPress.org

Sebbene a prima vista questa directory possa sembrare la stessa della directory del tema o del plugin, ha la funzionalità per aggiungere facilmente qualsiasi modello a qualsiasi post o pagina.

La ricerca di modelli di blocco nella directory dei modelli di WordPress.org è molto simile a quella che hai a disposizione sulla dashboard di WordPress. Puoi cercare per parola chiave o hai anche una serie di categorie per restringere la tua ricerca. Inoltre, se hai effettuato l'accesso a WordPress.org, puoi aggiungere qualsiasi modello ai segnalibri.

Quando fai doppio clic sul motivo, lo mostra in dettaglio e puoi selezionare tra diverse dimensioni dello schermo per vedere come appare in ciascuna di esse.

Modello di directory delle schede social del team di WordPress
Modello di directory di WordPress: social card del team

Come puoi vedere nell'immagine sopra, hai un pulsante con cui puoi copiare lo schema e dopo averlo incollato su qualsiasi pagina o post, hai già l'intero set di blocchi in modo da poter poi apportare le modifiche necessarie per adattarli a il tuo sito web come preferisci:

Sostituendo foto, testi e collegamenti, crei rapidamente una sezione di blocchi che si adatta perfettamente a ciò di cui hai bisogno in una pagina.

Facile, vero?

Aggiungi modelli alla directory dei modelli di WordPress

Sebbene sia ancora in corso il lavoro su come dovrebbe essere l'ambiente finale per la creazione e l'invio di modelli alla Directory dei modelli di WordPress, è ora aperta la chiamata per caricare i propri modelli da pubblicare nella directory. Vediamo come lo facciamo con un semplice esempio.

Per prima cosa devi creare il tuo modello. Puoi crearlo direttamente nell'editor dei blocchi, come può essere il caso del modello testimonial che ho appena creato di seguito da quello che abbiamo sulla nostra home page. Ricorda che se includi immagini, queste devono avere una licenza gratuita per uso commerciale.

Cosa dicono di noi i nostri clienti

I nostri clienti ci amano perché...

Immagine di un perfil de mujer

️️️️️
WOW Funziona davvero
Di gran lunga questo plugin è lo strumento migliore che abbiamo usato. Tutti i nostri clienti sono felici di lavorare con questo plugin. Facile da usare e bella interfaccia utente.

Nome Cognome – Posizione

Immagine di un perfil de mujer

️️️️️
WOW Funziona davvero
Di gran lunga questo plugin è lo strumento migliore che abbiamo usato. Tutti i nostri clienti sono felici di lavorare con questo plugin. Facile da usare e bella interfaccia utente.

Nome Cognome – Posizione

Immagine di un perfil de mujer

️️️️️
WOW Funziona davvero
Di gran lunga questo plugin è lo strumento migliore che abbiamo usato. Tutti i nostri clienti sono felici di lavorare con questo plugin. Facile da usare e bella interfaccia utente.

Nome Cognome – Posizione

Allora devi avere un Account Github e compilare un modulo predefinito in cui è necessario includere:

  • una descrizione del modello,
  • un titolo,
  • una categoria di quelle disponibili nella directory,
  • uno screenshot del modello,
  • crediti immagine che hai incluso e
  • il blocco di markup. Per fare ciò, devi solo posizionare il mouse nel gruppo che forma il pattern, fare clic sul pulsante con l'icona dei tre punti e fare clic su Copia (in modo da poterlo incollare in Github).
Invio di un nuovo modello alla directory dei modelli di WordPress
Modifica dell'invio di un nuovo modello alla directory dei modelli di WordPress.

E questo è tutto. Puoi andare alla scheda Anteprima per vedere come è andata a finire e infine fare clic sul pulsante Invia nuovo problema .

Visualizzazione del modello inviata alla directory del modello di WordPress
Visualizzazione del modello inviato alla directory del modello di WordPress.

Ora devi solo aspettare che qualcuno lo esamini in modo che diventi disponibile nella directory dei modelli di WordPress.

Notizie di directory

Come accennato in precedenza, il processo per l'invio dei modelli è ancora in fase di sviluppo. Il lavoro è stato fatto in modo che tu non debba inviare da GitHub e devi solo accedere a WordPress.org.

L'idea su cui si sta lavorando è che da https://wordpress.org/patterns/new-pattern/ (attualmente la pagina è vuota), vedrai una pagina simile alla seguente immagine in cui, una volta effettuato l'accesso a WordPress.org, avrai un pulsante Crea modello.

Proposta per una nuova pagina di creazione del modello
Mockup per una nuova pagina di creazione del modello (fonte: Block Pattern Directory).

Per creare un modello, sarai in grado di utilizzare un'istanza ospitata in WordPress dell'editor di blocchi. Questo editor funzionerà (per la maggior parte) come il normale editor di blocchi, ma con alcune modifiche. La prima modifica è che avrai una versione personalizzata del popup di benvenuto dell'editor incentrato sulla creazione e l'invio di modelli.

Mockup di popup di benvenuto dell'editor di modelli
Mockup di popup di benvenuto dell'editor di modelli (fonte: Directory dei modelli di WordPress.org.

D'altra parte, la barra laterale di modifica di un pattern includerà anche informazioni su di esso, come il titolo, la descrizione e le categorie.

Mockup della barra laterale dell'editor di modelli
Mockup della barra laterale dell'editor di modelli (fonte: Directory dei modelli di WordPress.org).

Infine, avrai la possibilità di inviare il modello da rivedere e condividerlo con il resto del mondo.

Mockup della presentazione di un modello da rivedere e pubblicazione nella directory del modello
Mockup di un modello inviato per la revisione e la pubblicazione nella directory del modello (fonte: WordPress.org Pattern Directory).

Riassumendo

I modelli di blocco di WordPress probabilmente finiranno per essere gli elementi più utilizzati per la progettazione di pagine e post. Sono abbastanza utili per aggiungere sezioni che hanno perfettamente senso come unità e che ti consentono di costruire pagine molto più velocemente che se dovessi aggiungere ciascuno dei blocchi che compongono quella sezione uno per uno. E la ricerca di modelli nella directory verrà standardizzata in modo simile a quella di plugin e temi.

Personalmente, quando ora guardo i modelli disponibili nella directory, trovo ancora difficile trovare quelli che userei direttamente sul mio sito web. Ma so che questo cambierà nel giro di pochi giorni. Quando i grandi designer inizieranno ad aggiungere le loro proposte, avremo un'enorme esplosione di design a portata di mano che ci consentirà di aggiornare le nostre pagine molto più velocemente.

Foto di Nick Morrison su Unsplash.