Come aggiungere le fisarmoniche nell'editor di blocchi di WordPress

Come aggiungere le fisarmoniche nell'editor di blocchi di WordPress

Una fisarmonica è un elemento di layout basato su levette che nasconde e rivela il contenuto quando si fa clic. Si vede un titolo, si fa clic su di esso e il resto del contenuto scorre verso il basso. Facendo di nuovo clic, il contenuto si nasconde. È come una tendina, ma per i contenuti invece che per i menu.

Cosa succede se si implementano correttamente le fisarmoniche? I contenuti diventano più facili da esplorare, gli utenti si concentrano, la navigazione mobile migliora e i motori di ricerca possono premiarvi con una migliore visibilità. Se fate tutto nel modo giusto, funzioneranno come un indice che risponde alle domande prima ancora che gli utenti le pongano.

Questa guida vi mostrerà come implementare le fisarmoniche in WordPress utilizzando strumenti editor-friendly che mantengono il processo semplice e pulito, senza bisogno di codifica.


Aggiungere fisarmoniche in WordPress

Esiste più di un modo per aggiungere fisarmoniche in WordPress, ma non tutti sono facili da usare nell'editor di blocchi. Nelle prossime sezioni, inizieremo con un metodo di base utilizzando un blocco incorporato, per poi passare a un'opzione più flessibile con un plugin.

Metodo 1: Utilizzo del blocco dettagli nativi

Il modo più semplice per creare una fisarmonica in WordPress è quello di utilizzare la funzione integrata Blocco dei dettagli. Vediamo come funziona.

Passo 1: Aggiungere il blocco Dettagli

Aprire il post o la pagina nell'Editor blocchi. Fare clic sull'icona più (+), cercare Dettagli e inserire il blocco.

Aggiungere il blocco Dettagli

Fase 2: Aggiungere il titolo e il contenuto

Inserire il titolo della fisarmonica nel segnaposto "Scrivi sommario". Quindi, fare clic sull'icona della freccia accanto per espandere la sezione. Una volta espansa, apparirà un'area di contenuto in cui sarà possibile aggiungere testo, immagini, elenchi o qualsiasi altro blocco.

Fase 3: aggiunta di altre levette

Per aggiungere altri elementi alla fisarmonica, ripetere la stessa procedura inserendo nuovi blocchi Dettagli. Per un layout annidato, espandere l'area del contenuto di un blocco Dettagli esistente, fare clic sull'icona più (+) al suo interno e aggiungere un altro blocco Dettagli.

Questo metodo è perfetto per le FAQ veloci o per le configurazioni minime. Tenete presente che offre solo uno stile di base e non include opzioni di progettazione avanzate.


Metodo 2: Utilizzo del plugin Ultimate Blocks

Se si desiderano più opzioni di stile e un migliore controllo sulla fisarmonica, l'opzione Blocchi definitivi è un'ottima scelta. Offre un blocco Content Toggle che funziona perfettamente nell'editor di blocchi.

Passo 1: Aggiungere il plugin al sito

Dalla vostra dashboard di WordPress, andate nel menu Plugin e fate clic su Aggiungi nuovo. Nella barra di ricerca, digitate Ultimate Blocks, quindi fate clic su Installa ora nella scheda del plugin. Al termine dell'installazione, attivatelo per rendere disponibili i nuovi blocchi nell'editor.

Aggiungete i blocchi Ultimate al vostro sito

Passo 2: inserire il blocco Toggle Content

Aprire la pagina o il post in cui si desidera la fisarmonica. Fare clic sull'icona più (+), cercare il blocco Contenuto e aggiungerlo. Questo blocco crea una sezione espandibile con un titolo e un'area di contenuto.

Inserire il blocco Toggle Content

Fase 3: Aggiungere titolo e contenuto

Digitare il titolo dell'accordion nel campo dell'etichetta, quindi aggiungere il contenuto sottostante. È possibile includere qualsiasi tipo di blocco all'interno del toggle, come testo, immagini, pulsanti, elenchi o persino un altro blocco Content Toggle all'interno dell'area del contenuto per creare un accordion annidato. 

Aggiungere titolo e contenuto

Per aggiungere altre sezioni, basta fare clic sull'icona (+) quando si passa il mouse sui pannelli esistenti. Per rimuovere un pannello, procedere allo stesso modo, ma invece di fare clic sull'icona (+), scegliere l'icona (x) nell'angolo in alto a destra. 

Aggiungere altri pannelli

Passo 4: personalizzare la fisarmonica

Dal pannello delle impostazioni del blocco sulla destra, è possibile controllare il titolo del pannello, regolare lo stato dei toggle, attivare le FAQ Schema, aggiungere un'opzione di ricerca integrata per l'accordion, scegliere un'icona di stato, modificare i colori del testo o dello sfondo e molto altro ancora. 

Personalizzare la fisarmonica
Personalizzare la fisarmonica

Se lo si usa per le FAQ, si può anche attivare il markup FAQ Schema dalle impostazioni per aiutare i contenuti a qualificarsi per i rich snippet nella ricerca di Google.

Abilitare lo schema

Conclusione

Se l'obiettivo è rendere più facile la scansione di contenuti lunghi, le fisarmoniche rappresentano una soluzione pulita. Abbiamo imparato due approcci: il blocco nativo Details offre una configurazione leggera, senza plugin aggiuntivi e con un caricamento veloce. Il blocco Content Toggle di Ultimate Blocks aggiunge controlli di stile avanzati, pannelli annidati e uno schema di FAQ integrato. Entrambi i metodi migliorano l'usabilità mobile e il potenziale SEO. Scegliete l'approccio che meglio si adatta al vostro flusso di lavoro e alle vostre esigenze di contenuto.



Il team Tableberg

Costruite bellissime tabelle WordPress - visivamente!

Dite addio alle tabelle noiose. Con Tableberg è possibile creare tabelle interattive e reattive utilizzando l'editor di blocchi, senza bisogno di codice.

Interfaccia Tableberg
🚀 Ottenere il miglior plugin di blocco tabella a 30% OFF!
Questo è il testo predefinito per la barra di notifica