Vai al contenuto

Blog web design, grafica e dintorni

Illustrazione in stile flat che rappresenta pattern riutilizzabili nell’editor Gutenberg di WordPress, utile per web designer freelance – Alice Petrella

Pattern Gutenberg: guida pratica ai blocchi riutilizzabili di WordPress

Se stai iniziando a familiarizzare con Gutenberg, probabilmente hai già scoperto quanto possa essere comodo costruire il layout di una pagina usando i blocchi.
Ma quando cominci a lavorare su più pagine simili o progetti ricorrenti, c’è uno strumento che davvero ti cambia la vita: i pattern personalizzati.

Sono una delle funzioni che uso di più quando progetto siti per i miei clienti. Mi aiutano a velocizzare il flusso di lavoro, mantenere coerenza visiva e ridurre al minimo gli errori. In questo articolo ti spiego come funzionano, ti mostro quando usarli, come crearli in modo efficace e ti lascio qualche esempio pratico da replicare nel tuo prossimo progetto.


I pattern di Gutenberg – fino a poco tempo fa si chiamavano “blocchi riutilizzabili” – sono gruppi di blocchi che puoi salvare e riutilizzare in più pagine o articoli del tuo sito WordPress. In pratica, ti permettono di progettare una volta sola una sezione del sito, come ad esempio:

…e di reinserirla ovunque ti serva, con pochi clic e senza doverla ricreare da zero ogni volta. Esistono due tipi di pattern:

  • Sincronizzati: modificandone uno, si aggiornano automaticamente anche tutti gli altri.
  • Non sincronizzati: funzionano come un copia-incolla intelligente. Li usi come base ma poi puoi modificarli senza influenzare gli altri.

Oltre a farti risparmiare tempo, i pattern ti aiutano a mantenere coerenza visiva e comunicativa su tutto il sito. Ad esempio, puoi creare una sezione “Contattami” ben impaginata con colori, font e call-to-action coerenti con il tuo brand, e inserirla facilmente alla fine di ogni pagina o articolo. Questo non solo migliora l’estetica e la navigazione, ma rafforza anche la tua identità professionale, specialmente se applicato a un sito web responsive progettato su misura.

Inoltre, se scegli di sincronizzare il pattern, ogni modifica che farai si applicherà automaticamente a tutte le pagine in cui è stato inserito, evitandoti errori e risparmiandoti tempo prezioso in fase di aggiornamento. È una funzione fondamentale quando gestisci siti complessi o quando vuoi assicurarti che sezioni chiave restino sempre uniformi.

Ecco perché i pattern sono così utili:

Garantiscono coerenza visiva e comunicativa in tutto il sito

Evitano errori o dimenticanze quando modifichi sezioni comuni

Rendono la progettazione più veloce (e piacevole!), lasciandoti più spazio per la parte creativa

Migliorano la gestione del sito nel tempo, specialmente se crei template da offrire a clienti


  1. Crea la sezione che vuoi salvare, ad esempio una call to action.
  2. Seleziona tutti i blocchi della sezione (puoi cliccare nel blocco padre, o usare la visualizzazione struttura)
  3. Clicca sui tre puntini verticali (⋮) nel menu del blocco
  4. Scegli “Crea pattern” dal menu a tendina
  5. Dai un nome descrittivo al tuo pattern (es. “CTA con sfondo viola”)
  6. Seleziona se vuoi che sia sincronizzato o meno:
    • ✅ sincronizzato: utile per intestazioni, footer o disclaimer
    • ❌ non sincronizzato: ideale per schede, grafiche decorative, o CTA che cambiano contenuto
  7. Salva: lo troverai in Aspetto > Pattern > I miei pattern o nella libreria pattern quando crei un nuovo blocco

Immagina di voler creare una CTA da inserire in fondo a tutti i tuoi articoli. Ecco gli step dettagliati:

  • Crea una sezione con sfondo usando il blocco “Gruppo” o “Copertina”
  • Aggiungi un titolo accattivante (es: “Hai bisogno di un sito professionale?”) magari utilizzando un h2
  • Inserisci un paragrafo descrittivo, che racconti i vantaggi del contatto
  • Aggiungi un pulsante con la scritta “Contattami” e collegalo alla pagina contatti.
  • Imposta colori e spaziature coerenti con il tuo brand.
  • Seleziona tutta la sezione e clicca sui Crea pattern.
  • Salva come sincronizzato se vuoi modificarla una sola volta per tutti gli articoli in futuro.

Ora ogni volta che scrivi un articolo, ti basta cercare quel pattern e inserirlo in fondo. Facile e smart!


Puoi usare nomi tipo “CTA – Blog”, “Testimonial – Progetto”, “Scheda Servizio – Cliente X” per trovarli più facilmente nella tua libreria. WordPress li elenca in ordine alfabetico, quindi un sistema di naming intelligente ti fa risparmiare tempo.


Non c’è un comando “duplica” nativo, ma puoi:

  • Inserire un pattern non sincronizzato in una pagina
  • Personalizzarlo
  • Selezionare la nuova versione e salvarla come nuovo pattern

Vai su AspettoPatternI miei pattern e clicca “Modifica” sotto al nome del pattern. Ogni modifica verrà aggiornata ovunque lo hai usato.


Un pattern può contenere interi layout: righe, colonne, immagini, pulsanti, titoli, gradienti, icone. Puoi creare pagine intere composte da pattern modulari. È ottimo per template ricorrenti (pagina progetto, articolo, portfolio, ecc.).


Se lavori su più siti, magari per clienti diversi, ti farà comodo sapere che puoi esportare e importare i tuoi pattern personalizzati.
Con plugin come Block Export Import puoi salvare un pattern da un progetto e riutilizzarlo altrove in pochi clic. Perfetto se, come me, hai sezioni che usi spesso – tipo una CTA collaudata o una hero che funziona sempre – e vuoi portarle con te senza doverle ricreare ogni volta.

Usare i pattern di Gutenberg in modo strategico ti aiuta a lavorare con più velocità, coerenza e controllo. È uno strumento spesso sottovalutato, ma quando impari a usarlo bene, diventa un alleato potente per migliorare l’efficienza e l’organizzazione del tuo flusso di lavoro.

E se vuoi spingerti oltre, ricorda che puoi unire i pattern con plugin come GenerateBlocks o Lazy Blocks per creare sezioni modulari su misura, ottimizzate e visivamente curate.

Hai bisogno di una mano con Gutenberg?