Come selezionare e utilizzare i blocchi nidificati in WordPress

Pubblicato: 2023-06-23

Vuoi imparare a selezionare e utilizzare i blocchi nidificati in WordPress?

La funzionalità dei blocchi nidificati di WordPress Gutenberg ti consente di aggiungere più blocchi all'interno di un blocco genitore. Quindi, puoi personalizzare diversi elementi di blocco contemporaneamente, organizzare i contenuti dei post in modo efficiente e accedere a una maggiore flessibilità di progettazione.

In questo articolo, ti mostreremo come selezionare e utilizzare facilmente i blocchi nidificati di WordPress.

Select and use nested blocks in WordPress

Cosa sono i blocchi nidificati di WordPress?

La funzione di blocco nidificato di WordPress Gutenberg ti consente di inserire (o "nidificare") uno o più blocchi all'interno di un altro blocco.

I blocchi nidificati ti aiutano a creare layout più complessi sul tuo sito Web WordPress aggiungendo più blocchi uno dentro l'altro. Ciò consente una maggiore flessibilità durante la progettazione e la formattazione dei contenuti per pagine e post.

Ad esempio, puoi nidificare più blocchi Immagine all'interno di un blocco Gruppo per visualizzare una serie di foto di un particolare evento o una serie di opere d'arte create utilizzando una particolare tecnica.

Preview of WordPress nested blocks

Inoltre, la funzione di blocco nidificato consente di modificare i singoli blocchi separatamente. Ciò significa che puoi personalizzare ogni blocco in base alle tue esigenze senza influire sugli altri blocchi. A sua volta, ciò si traduce in una migliore organizzazione dei contenuti, rende i tuoi contenuti più attraenti e semplifica il processo di creazione dei contenuti.

Detto questo, vediamo come puoi facilmente selezionare e utilizzare i blocchi nidificati Gutenberg di WordPress.

Come utilizzare i blocchi nidificati di WordPress

Puoi facilmente nidificare più blocchi insieme utilizzando il blocco Gruppo o Colonne nell'editor di blocchi Gutenberg.

Innanzitutto, devi aprire un post esistente o nuovo nell'editor di blocchi dalla barra laterale di amministrazione di WordPress.

Da qui, fai semplicemente clic sul pulsante "+" nell'angolo in alto a sinistra dello schermo e trova il blocco "Gruppo". Facendo clic su di esso e aggiungendolo alla pagina, dovrai selezionare un layout per i blocchi che anniderai insieme.

Per questo tutorial, selezioneremo il layout "Gruppo".

Select Group block from the block menu

Quindi, fai semplicemente clic sul pulsante "+" sullo schermo per iniziare ad aggiungere contenuti all'interno del blocco principale.

Per il bene di questo tutorial, aggiungeremo un blocco Immagine.

Add an image block within the Group block

Dopo aver aggiunto il blocco Immagine, fai clic sul pulsante "Raggruppa" nella barra degli strumenti del blocco in alto per selezionare il blocco principale.

Successivamente, devi fare clic sul pulsante "+" per aprire il menu dei blocchi, da dove puoi scegliere altri blocchi da aggiungere.

Open the block menu to add another block within the Group block

Come configurare le impostazioni del blocco annidato di WordPress

Dopo aver nidificato più blocchi, puoi configurare le loro impostazioni individuali facendo clic su ciascun blocco. Questo aprirà le impostazioni del blocco nella colonna di destra sullo schermo.

Da qui, puoi regolare il colore di sfondo, il colore del testo e le dimensioni dei singoli blocchi senza influire sugli altri blocchi nidificati al suo interno.

Configure the individual block settings

Per configurare insieme le impostazioni di tutti i blocchi nidificati, dovrai fare clic sul pulsante "Raggruppa" nella barra degli strumenti del blocco in alto. Questo aprirà le impostazioni del blocco genitore nella colonna di destra.

Ora puoi configurare la giustificazione, l'orientamento, il colore di sfondo, il colore del testo e la tipografia di tutti i blocchi nidificati.

Tieni presente che queste impostazioni influiranno su tutti i blocchi nidificati all'interno del blocco principale.

Configure the settings of the Group block

Puoi anche convertire un singolo blocco esistente in blocchi nidificati facendo clic sul pulsante "Opzioni" nella barra degli strumenti superiore di qualsiasi blocco.

Si aprirà un prompt del menu, in cui è necessario selezionare l'opzione "Crea blocco riutilizzabile".

Choose the Create Reusable Block option

Dopo averlo fatto, verrà creato un nuovo blocco riutilizzabile in cui è possibile aggiungere più blocchi.

Al termine, non dimenticare di fare clic sul pulsante "Pubblica" o "Aggiorna" per salvare le modifiche.

Create nested blocks

Nel nostro esempio, abbiamo nidificato un blocco Titolo, Immagine e Paragrafo all'interno di un blocco Gruppo. Ecco come apparivano i blocchi nidificati sul nostro sito web dimostrativo.

Preview of WordPress nested blocks

Bonus: usa il plug-in Wayfinder per selezionare facilmente i blocchi nidificati

A volte, può essere difficile selezionare un singolo blocco e configurarlo quando sono presenti più blocchi nidificati insieme.

Fortunatamente, il plug-in Wayfinder semplifica la selezione di blocchi nidificati da un blocco principale e ti dice persino il tipo e la classe dei blocchi.

Innanzitutto, dovrai installare e attivare il plug-in Wayfinder. Per ulteriori istruzioni, ti consigliamo di consultare la nostra guida su come installare un plug-in di WordPress.

Dopo l'attivazione, vai alla pagina Impostazioni »Wayfinder dalla barra laterale di amministrazione di WordPress.

Una volta che sei lì, tutte le impostazioni saranno già attivate. Devi semplicemente deselezionare la casella accanto alle impostazioni che non desideri utilizzare.

Ad esempio, se desideri che Wayfinder visualizzi i tipi di blocco per tutti i blocchi nell'editor, tieni selezionata la casella accanto all'opzione "Visualizza tipo di blocco".

Configure the Wayfinder plugin settings

Tuttavia, se non desideri che il plug-in visualizzi le classi di blocco, deseleziona semplicemente la casella accanto a tale opzione.

Dopo aver configurato le impostazioni, non dimenticare di fare clic sul pulsante "Salva modifiche".

Successivamente, devi aprire un post esistente o nuovo dalla barra laterale di amministrazione di WordPress.

Una volta che sei lì, passando il mouse su qualsiasi blocco mostrerà un contorno con il suo nome. Sarai anche in grado di vedere il contorno e il nome di tutti i blocchi nidificati all'interno del blocco principale.

GIF for the Wayfinder plugin

Questo ti aiuterà a identificare tutti i diversi blocchi nidificati all'interno di un blocco Gruppo o Colonne.

Da qui, puoi facilmente selezionare un singolo blocco dal blocco principale per configurarne le impostazioni.

Use Wayfinder plugin to easily select a block

Puoi anche selezionare tutti i blocchi nidificati contemporaneamente semplicemente facendo clic sull'intestazione "Colonne" o "Gruppo". Questo aprirà le impostazioni del blocco principale nella colonna di destra.

Dopo aver configurato le impostazioni del blocco, fai semplicemente clic sul pulsante "Aggiorna" o "Pubblica" per salvare le modifiche.

Click the Group block outline to open its settings

Speriamo che questo articolo ti abbia aiutato a imparare come selezionare e utilizzare i blocchi nidificati di WordPress. Potresti anche voler vedere il nostro tutorial su come modificare l'altezza e la larghezza del blocco in WordPress e le nostre migliori scelte per i plug-in WordPress indispensabili per far crescere il tuo sito.

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per i video tutorial di WordPress. Puoi trovarci anche su Twitter e Facebook.