Come utilizzare i pattern a blocchi di WordPress: una semplice guida

Dal rilascio di WordPress 5.8 nel 2021, i pattern a blocchi sono diventati un modo sempre più popolare per creare contenuti in WordPress. Consentono a sviluppatori e designer di utilizzarli in ogni aspetto dei loro siti Web, inclusi intestazioni, piè di pagina, post, pagine e altro. Come bonus aggiuntivo, gli utenti possono salvare i modelli di blocco di WordPress per rendere il processo di progettazione più rapido e semplice. In questo post, discuteremo cosa sono i pattern a blocchi e come usarli. Iniziamo.

Cosa sono i Block Pattern di WordPress?

Quando crei contenuti in WordPress, puoi inserire un gruppo di blocchi nei tuoi post o pagine per visualizzare i tuoi contenuti in modo bello e funzionale. Questi gruppi di blocchi sono chiamati schemi di blocco di WordPress. WordPress offre una serie di schemi di blocchi predefiniti all'interno del repository di WordPress. Inoltre, la maggior parte dei temi WordPress ne avrà anche una raccolta. I modelli di blocco possono essere modificati con la stessa facilità di qualsiasi blocco creato. I modelli possono contenere diversi blocchi o anche intere pagine. E, con la modifica completa del sito in WordPress, possono essere utilizzati ovunque e sono anche utili per creare intestazioni, piè di pagina, modelli di pagina, query e altro ancora.

Pattern di blocchi di WordPress vs blocchi riutilizzabili

Come affermato in precedenza, un modello di blocco è un gruppo di blocchi che possono essere inseriti in un articolo, una pagina, una parte del modello o un modello. I modelli di blocco possono essere inseriti in più posizioni ma modificati individualmente . I modelli di blocco possono essere salvati come blocchi riutilizzabili, ma una volta che ciò accade, cambierà ovunque venga utilizzato il blocco riutilizzabile. Quindi, in sostanza, i blocchi riutilizzabili assumono una proprietà globale, mentre i pattern di blocco sono una raccolta di blocchi che possono essere modificati per avere un aspetto diverso, indipendentemente da quante volte vengono utilizzati in un sito web.

Come trovare nuovi pattern di blocchi di WordPress

Ci sono alcuni posti dove trovare i pattern di blocco di WordPress. Il primo modo è all'interno del tema WordPress stesso. Come accennato in precedenza, la maggior parte dei temi contiene schemi di blocco che puoi utilizzare per il tuo sito web. Ad esempio, il tema Twenty Twenty-Two ha una discreta raccolta di modelli. Puoi scegliere tra categorie tra cui colonne, testo, gallerie, pagine e altro.

Un altro modo per trovare i modelli di blocco è all'interno della directory dei modelli di blocco di WordPres. Attualmente ci sono più di 65 pagine di modelli da utilizzare tra cui intestazioni, piè di pagina, wireframe, colonne, pulsanti e altro.

Come aggiungere pattern a blocchi al tuo sito

L'aggiunta di schemi di blocco al tuo sito Web è un processo semplice. Se vuoi cercare all'interno del tuo tema per aggiungere un motivo, fai semplicemente clic sull'icona blu + in alto a sinistra dello schermo.

Successivamente, passa a Patterns . Seleziona il modello che desideri utilizzare, quindi fai clic su di esso per aggiungerlo automaticamente alla tua pagina.

Un altro modo per aggiungere pattern di blocchi al tuo sito è copiarli e incollarli dalla directory dei pattern. Passare alla directory dei pattern, individuare il pattern di propria scelta, quindi passare il mouse sopra di esso per visualizzare il pulsante di copia .

Quindi, torna alla tua pagina. Fare clic all'interno della scheda di modifica e fare clic con il pulsante destro del mouse e selezionare incolla oppure utilizzare CTRL + V (in Windows) o CMD + V (Mac) . Il tuo modello di blocco apparirà sulla pagina. Puoi riorganizzarne la posizione facendo clic sulla visualizzazione elenco , quindi trascinandola nella posizione desiderata.

Come utilizzare i pattern a blocchi in WordPress

Usare i pattern a blocchi in WordPress è facile. Come accennato in precedenza, possono essere modificati proprio come qualsiasi altro blocco. Ora che sai come accedervi e aggiungerli al tuo sito, andiamo a modificarli.

In genere, quando importi un modello di blocco nella tua pagina, verrà raggruppato. Raggruppare i blocchi rende facile trascinarli sulla pagina, nonché regolare impostazioni come larghezza, colore, dimensione tipografica, riempimento e spaziatura dei blocchi, sul gruppo stesso.

Per apportare modifiche a un singolo blocco all'interno del gruppo, è sufficiente fare clic per modificarlo. La modifica di singoli blocchi non richiede di separarli e vengono modificati allo stesso modo dei normali blocchi. Ad esempio, diamo un'occhiata al blocco immagine all'interno del nostro modello. Puoi aggiungere collegamenti, ritagliare, aggiungere testo o sostituire l'immagine, proprio come faresti altrimenti.

Puoi aggiungere tutti i modelli di blocco che desideri nel tuo layout. L'aggiunta di modelli è un modo semplice per creare bellissimi contenuti in un attimo. Inoltre, rimuovere i blocchi è altrettanto semplice. Se desideri rimuovere un modello dalla pagina, fai semplicemente clic sull'elemento principale nella visualizzazione elenco o fai clic sul menu con i puntini di sospensione nell'editor di pagina, quindi fai clic su Rimuovi gruppo .

Come creare e salvare i propri pattern di blocchi in WordPress

Esistono alcuni modi per creare e salvare schemi di blocchi in WordPress. Il modo in cui lo fai dipende dal tuo livello di esperienza e se vuoi condividerlo con gli altri. Immergiamoci per conoscere la creazione, il salvataggio e la condivisione di schemi di blocco.

Crea pattern di blocco nella directory dei pattern di WordPress

Questo metodo richiede di avere un account WordPress, ma è il modo più semplice per creare modelli da utilizzare nel tuo sito web. Inizia andando alla directory dei pattern di WordPress. Successivamente, fai clic su crea un nuovo modello .

Successivamente, dovrai accedere o creare un nuovo account WordPress. Una volta effettuato l'accesso, verrai reindirizzato all'editor di modelli. Funziona allo stesso modo dell'editor di pagine nel tuo sito web. Come bonus aggiuntivo, avrai accesso a immagini royalty-free da utilizzare nei tuoi modelli. Per iniziare, assegna un nome al modello, quindi inizia ad aggiungere blocchi facendo clic sul pulsante nero + .

Una volta che hai finito di progettare il tuo modello di blocco, è il momento di salvarlo per utilizzarlo sul tuo sito web. Ci sono due opzioni per salvare il tuo modello. Scegliendo Salva bozza potrai salvare il modello solo per tuo uso . Sarai in grado di mantenere il tuo modello nel cloud e accedervi in ​​qualsiasi momento per copiarlo e incollarlo nel tuo sito web.

Per accedere ai tuoi modelli, torna alla pagina della directory dei modelli e fai clic sul collegamento I miei modelli. Sia le tue bozze che i preferiti possono essere utilizzati nei tuoi siti WordPress.

Invia il tuo modello di blocco a WordPress

WordPress consente ai suoi utenti di creare e inviare modelli di blocco affinché tutti i suoi utenti possano utilizzarli nei temi di blocco di WordPress. In effetti, la galleria di modelli è proprio questo: modelli inviati dall'utente. Per creare un modello di blocco per l'invio, segui i passaggi nella sezione precedente. Tuttavia, questa volta, farai clic sul pulsante di invio . Il tuo modello passerà attraverso un processo di revisione prima di essere aggiunto alla directory. Una volta pubblicato, il tuo pattern sarà visibile nella directory dei pattern di WordPress dove è accessibile a chiunque.

Utilizzare un plug-in per creare modelli di blocco

Con la crescente popolarità dei blocchi Gutenberg, ci sono più opzioni per salvare i modelli di blocco nei tuoi siti web che mai. Fino a poco tempo fa, se volevi creare un pattern a blocchi all'interno di WordPress, dovevi codificarlo da solo, il che non è adatto ai principianti. Per fortuna, ci sono alcune opzioni per le persone che vogliono crearle facilmente.

Plug-in CoBlocks

CoBlocks è stato creato da GoDaddy. Ti offre una raccolta di oltre 40 blocchi da utilizzare nel tuo sito Web, oltre alla possibilità di creare schemi di blocchi e registrarli. Il processo è semplice e richiede solo pochi passaggi. Innanzitutto, costruisci il tuo layout preferito. Successivamente, seleziona i blocchi che desideri includere nel tuo modello. Infine, seleziona Aggiungi modello di progettazione .

Assegna un nome al modello, assegnagli una descrizione facoltativa e assegna una categoria. Infine, fai clic su Salva modello .

Per visualizzare il motivo appena creato, vai alla scheda Motivi, seleziona la categoria assegnata e scorri verso il basso per visualizzarlo.

Blockmeister - Costruttore di schemi a blocchi

Un'altra opzione è il plugin Blockmeister – Block Pattern Builder. Il processo è molto simile a quello dei CoBlocks. Tuttavia, questo plug-in non ti fornisce alcun blocco aggiunto per i tuoi layout. Ti dà semplicemente la possibilità di creare modelli di blocchi. Per iniziare, crea il tuo layout, quindi seleziona tutti i blocchi da includere in esso. Successivamente, fai clic sul menu con i puntini di sospensione nella visualizzazione elenco, quindi seleziona Aggiungi a schemi di blocco .

Il passaggio successivo consiste nell'assegnare un nome al modello, quindi fare clic su Crea modello . Una volta salvato, aggiorna la tua pagina per trovare il pattern nella directory dei pattern del tuo tema.

Per individuare il tuo modello, utilizza il menu a tendina delle categorie nei modelli, quindi scegli il nome del tuo sito.

Schemi di blocco di WordPress vs layout Divi

Sia i modelli a blocchi che i layout Divi offrono le stesse funzionalità di base. Puoi crearli, modificarli, personalizzarli e salvarli. Tuttavia, Divi ha molto di più in termini di opzioni di personalizzazione, ecco dove finiscono le somiglianze tra i due. Vedi, le personalizzazioni dei blocchi sono basate sul tema, il che significa che ottieni solo quanto offre quel tema in termini di colori, caratteri ed effetti. Per ottenere più opzioni, gli utenti devono aggiungere plug-in o codice per ottenerli. Con Divi, hai a disposizione una vasta gamma di opzioni di personalizzazione per aiutarti a creare fantastici layout per il tuo sito web.

Divi non è solo un tema WordPress, è una piattaforma completa per la creazione di siti Web con molta potenza sotto il cofano. Divi utilizza un Visual Builder drag and drop proprietario che ti consente di creare bellissimi layout sul front-end, in tempo reale. Non è necessario visualizzare l'anteprima del layout in una nuova scheda per vedere come apparirà la tua pagina nel browser.

Divi ha opzioni di personalizzazione illimitate

Ci sono opzioni di design illimitate con oltre 200 elementi del sito web. All'interno di ogni elemento, ci sono incredibili opzioni di sfondo utilizzando il sistema dinamico di colori magici di Divi. Inoltre, puoi rendere impressionanti i tuoi layout con effetti di transizione, passaggio del mouse e animazione. Non solo, puoi regolare la spaziatura, il dimensionamento, aggiungere filtri e ombreggiature dei riquadri e molto altro ancora.

Salva layout utilizzando Divi Cloud

Quando vuoi riutilizzare un layout, Divi lo rende facile. Puoi salvare moduli, righe, sezioni o persino pagine intere utilizzando Divi. Inoltre, i layout possono essere salvati come globali in modo che quando devi apportare una modifica a un layout utilizzato in tutto il tuo sito, deve essere modificato solo una volta. Come bonus aggiuntivo, puoi salvare i tuoi layout su Divi Cloud, che ti consente di utilizzarli su qualsiasi sito Web Divi, ovunque.

Domande frequenti sui pattern di blocco di WordPress

Con tutto ciò che ti abbiamo lanciato nel post, potresti avere alcune domande sui modelli di blocco. La buona notizia è che abbiamo le risposte. Continuare a leggere.

I modelli di blocco sono come blocchi riutilizzabili?

In un certo senso sì. Sia i modelli di blocco che i blocchi riutilizzabili possono essere creati, salvati e modificati. Tuttavia, i blocchi riutilizzabili sono più simili ai blocchi globali. Ad esempio, se crei un blocco riutilizzabile come newsletter che scegli di utilizzare in tutto il tuo sito Web, apportare modifiche a un'istanza comporterà che tale modifica venga apportata ovunque venga visualizzato quel blocco. Se invece dovessi utilizzare un motivo a blocchi, potresti cambiare il colore di sfondo, il colore del pulsante o apportare altre modifiche al design senza che ciò influisca su ogni istanza.

Dove posso trovare i pattern di blocco per il mio sito web?

Come accennato in precedenza, puoi ottenerli nella directory dei pattern di WordPress, all'interno del tuo tema WordPress o con un plug-in come Gutenberg Template e Pattern Library di Extendify.

Perché dovrei usare i pattern a blocchi?

Insomma, è un ottimo modo per risparmiare tempo. Il più grande spreco di tempo con lo sviluppo di WordPress è la creazione del contenuto. Con i blocchi di pattern, puoi risparmiare tempo ed energia creando pattern che puoi utilizzare nelle pagine e nei post del tuo sito.

Posso creare blocchi di pattern manualmente?

Puoi! Tuttavia, dovrai essere a tuo agio nella scrittura e nella modifica del codice per creare blocchi di pattern manualmente. WordPress.org ha una buona lezione che ti aiuterà a guidarti nel processo se vuoi provarlo.

Concludere le cose

I modelli di blocco forniscono un modo semplice e veloce per aggiungere contenuti al tuo sito web. Inoltre, puoi trovare bellissimi design professionali nella directory dei modelli di WordPress per aiutarti a iniziare. Se non utilizzi blocchi di pattern nel tuo sito web, ti consigliamo vivamente di farlo.

Stai usando blocchi di pattern sul tuo sito web? Se è così, dicci perché ti piace usarli nella sezione commenti qui sotto.