Guida completa ai blocchi e ai pattern riutilizzabili di WordPress 

Il blocco riutilizzabile di WordPress è una potente funzionalità dell'editor di blocchi Gutenberg. Non hai più bisogno di copiare e incollare frammenti di contenuto riutilizzabili salvati in precedenza dal file del tuo computer. Invece, puoi facilmente riutilizzare lo stesso blocco di contenuto ovunque sul tuo sito web senza personalizzarlo ogni volta.

Nonostante la sua efficienza, molti utenti non sono a conoscenza di questa tecnica che fa risparmiare tempo, il che li porta a sprecare tempo e fatica inutilmente. Ecco perché abbiamo scritto un articolo approfondito sul blocco riutilizzabile di WordPress.

Imparerai come creare, utilizzare e configurare i blocchi riutilizzabili di WordPress e altri suggerimenti essenziali.

Continua a leggere...

Cos'è un blocco riutilizzabile (pattern) in WordPress?

I blocchi riutilizzabili di WordPress sono come normali blocchi di contenuto che gli utenti possono creare e salvare per un uso ripetuto in qualsiasi parte del loro sito web all'interno dell'editor di blocchi. Il processo include il raggruppamento di più blocchi come pattern e l'importazione in qualsiasi punto del tuo sito web.

Un esempio comune di utilizzo di questa funzionalità è il posizionamento del stesso invito all'azione o pulsante dei social media, modulo o banner promozionali in modo coerente in tutto il sito web. Pertanto, non dovrai personalizzare ripetutamente la stessa cosa. 

La parte migliore è che le modifiche verranno applicate automaticamente a tutte le pagine e ai post del tuo sito web. Non devi modificare ogni aspetto singolarmente. Inoltre, puoi anche esportare e importare il modello riutilizzabile in un altro sito web.

Differenza tra blocchi riutilizzabili e blocchi normali

Ecco alcune delle principali differenze tra i blocchi riutilizzabili di WordPress e i blocchi normali.

Quando hai bisogno di usare i blocchi riutilizzabili di WordPress 

Una delle cose davvero interessanti dell'uso dei blocchi riutilizzabili di WordPress è la semplificazione delle modifiche a livello di sito. Ad esempio, se hai bisogno di aggiorna il piè di pagina del tuo sito web o modificare lo sconto su un banner promozionale, c'è non c'è bisogno di cambiarlo manualmente su ogni post o pagina. 

Basta accedere alle impostazioni del blocco riutilizzabile e puoi effettuare l'aggiornamento in pochi clic. Questo la gestione centralizzata garantisce anche la coerenza del design nel sito web completo. Inoltre, troverai questi blocchi facilmente accessibili poiché sono archiviati in una sezione dedicata del tuo editor di blocchi. Ciò significa che questa funzionalità è utile per la collaborazione di gruppo.

Un'altra cosa che abbiamo menzionato prima è che i blocchi riutilizzabili possono anche essere condivisi tra diversi siti web. Puoi esportare e importare senza sforzo un blocco riutilizzabile su diversi siti webI blocchi riutilizzabili WP sono anche convertibili.

Come creare blocchi riutilizzabili di WordPress (Pattern) nell'editor Gutenberg di WordPress

Prendi una nuova pagina o un nuovo post come fai di solito. Quindi, fai clic su “+” nell'angolo in alto a sinistra della pagina per vedere tutti i blocchi disponibili. E trascina e rilascia il blocco sulla dashboard dell'editor di blocchi che vuoi rendere riutilizzabile. 

In questo tutorial, creeremo un pattern con blocchi riutilizzabili per mostrare tutti i nostri canali social. Per il nostro design, stiamo usando il Blocco di intestazione GutenKit E Blocco icone social GutenKit.

Notare che stiamo aggiungendo entrambi i blocchi all'interno di un blocco contenitore, quindi renderemo il blocco contenitore un blocco riutilizzabile. Ma puoi anche rendere un singolo blocco come blocco o pattern riutilizzabile seguendo lo stesso processo.

Ora, fai clic sull'icona a tre punti nella barra degli strumenti popup per visualizzare alcune impostazioni aggiuntive e fai clic su "Crea modello” opzione. 

Così facendo verrà visualizzato un popup che chiede il nome e la categoria del blocco riutilizzabile, e un pulsante di attivazione/disattivazione per sincronizzare questo blocco su più posizioni. Fatto, basta premere il pulsante "Aggiungere" pulsante. 

Ecco fatto! Hai creato con successo un pattern o un blocco riutilizzabile sul tuo sito web Gutenberg. Troverai il pattern nella categoria assegnata. Ora, impareremo a usarlo su post o pagine.

💡 Leggi anche la guida per principianti su come usare Gutenberg in WordPress

Come impostare i blocchi riutilizzabili di WordPress in post e pagine

Non ci sono ostacoli per impostare i blocchi riutilizzabili di WordPress nel tuo sito web WordPress. Inizia accedendo a una pagina o a un post esistente o creandone uno nuovo. Fai clic su "+” (Aggiungi blocco) come hai fatto prima. Ma qui devi selezionare “Modelli"scheda. 

Accedi alla categoria dei tuoi blocchi riutilizzabili e cliccaci sopra una volta che li vedi. Il blocco riutilizzabile verrà aggiunto al tuo post o alla tua pagina. Ad esempio, nell'immagine sopra, puoi vedere il nostro "Canali Sociali"modello o blocco riutilizzabile sotto il"Pulsante" categoria. Tutto qui. 

Puoi personalizzarlo dopo aver aggiunto un blocco o un pattern riutilizzabile. Per farlo, clicca su “Modifica originale" opzione sotto la barra degli strumenti del blocco. Vedrai una nuova schermata per modificare il pattern. Tuttavia, personalizzarlo inciderà anche su altri aspetti del sito web in cui lo utilizzi.

Come convertire i blocchi riutilizzabili di WordPress per un post specifico

Conosciamo un'altra parte importante dell'utilizzo dei blocchi riutilizzabili di WordPress, ovvero la personalizzazione dei pattern o dei blocchi riutilizzabili senza modificare altri utilizzi del blocco sul sito web. Per questo, devi convertire il blocco riutilizzabile di WordPress in uno normale. 

Seleziona il blocco riutilizzabile e clicca sui tre punti verticali sul lato destro del menu della barra degli strumenti. Cerca “Staccare" e cliccaci sopra. In questo modo convertirai il blocco riutilizzabile in un blocco normale. Quindi, sarai libero di apportare qualsiasi modifica a quel blocco.

Come gestire i blocchi riutilizzabili (modelli) nell'editor di WordPress

Potresti avere più blocchi e pattern riutilizzabili e vuoi gestirli da una posizione centralizzata. Nessun problema! Hai anche questo vantaggio. Vai alla dashboard di WordPress e segui Aspetto > Editor. 

Verrai spostato in una nuova pagina, dalla barra laterale sinistra seleziona "Modelli" opzione sotto la "Progetto" tab. Troverai tutte le categorie di pattern, scegli quella che preferisci.

Sul lato destro, vedrai i blocchi riutilizzabili. Puoi modificare, duplicare, eliminare ed esportare per l'uso su un altro sito web WordPress. 

Come importare/esportare blocchi riutilizzabili (modelli) in WordPress

I vantaggi dell'utilizzo di blocchi riutilizzabili di WordPress non si limitano solo al loro utilizzo in tutto il sito web, ma anche all'esportazione e all'importazione in altri siti web. È un grande risparmio di tempo per qualsiasi sviluppatore.

Se hai installato l'ultima versione di WordPress, dalla dashboard di amministrazione, procedi come mostrato sopra: Aspetto > Editor > Design > Modelli.

Per esportare un blocco o un modello riutilizzabile: Seleziona la categoria del pattern e clicca sull'icona verticale a tre punti del pattern che vuoi esportare. Vedrai un'opzione intitolata "Esporta come JSON”, Cliccalo per salvare il file JSON sul tuo dispositivo.

Per importare un blocco o un pattern riutilizzabile: Quando sei nella pagina dei modelli, clicca su “Aggiungi nuovo modello"opzione e quindi premi"Importa modello da JSON" per caricare il file JSON dal tuo computer.

Domande frequenti

Incartare!

Tutto sommato, come utente di WordPress, cerchi ciò che rende il tuo lavoro più semplice. E WordPress ha sviluppato continuamente varie nuove funzionalità utili e che fanno risparmiare tempo, come i blocchi recuperabili

Se sai come usare e gestire i blocchi riutilizzabili di WordPress, puoi risparmiare un sacco di tempo evitando il lavoro ripetitivo. E speriamo che questo blog ti abbia aiutato a distinguere tra blocchi riutilizzabili di WordPress e blocchi normali.