Disclaimer: questa è la libera traduzione dell’articolo pubblicato sul blog di Elementor dedicato a chi sviluppa. Trovi la versione originale qui.
La versione 3.34 di Elementor continua l’evoluzione dell’Editor V4 ampliando le funzionalità di layout componibili, introducendo il primo livello di interazioni e perfezionando i sistemi di base per migliorare la coerenza, la prevedibilità e l’estensibilità.
Questa versione introduce ulteriori modelli di interfaccia utente fondamentali, rafforzando al contempo l’architettura sottostante che supporta lo styling CSS-first e i flussi di lavoro basati sulle classi.
Tutte le funzionalità descritte di seguito si applicano all’Editor V4, che rimane in versione Alpha ed è ancora in fase di sviluppo attivo. Pertanto, il nostro invito è di aggiornare su siti in produzione, MA attivare l’Editor V4 solo su siti di test o di staging.
Editor V4 – Atomic Editor
Editor V4 rappresenta la continua riorganizzazione di Elementor secondo i principi dell’atomic design, una struttura esplicita e un comportamento stilistico prevedibile. Anziché astrarre il layout e il comportamento dietro i widget, V4 espone la composizione attraverso elementi Atomici, Classi Globali e una separazione più chiara tra struttura, stile e comportamento.
Le funzionalità introdotte nella versione 3.34 si basano su queste fondamenta e riflettono la direzione intrapresa dall’Editor verso un sistema completamente atomico ed estensibile.
Poiché Editor V4 è ancora in fase Alpha, queste funzionalità sono sperimentali e potrebbero subire modifiche man mano che vengono raccolti i feedback e il sistema evolve.
Schede nidificate
Elementor 3.34 introduce le schede nidificate come sostituto completamente atomico dei widget a schede predefiniti, consentendo a chi sviluppa di creare interfacce a schede utilizzando elementi atomici espliciti e componibili.
Le schede sono esposte come una chiara gerarchia strutturale che separa trigger, aree di contenuto e pannelli, consentendo un controllo granulare sul layout e lo stile.
Poiché le schede nidificate sono interamente basate sul sistema di styling atomico, qualsiasi parte della struttura può essere stilizzata con classi globali, nidificata con altri elementi atomici e compresa direttamente attraverso il pannello Struttura.
Questa versione aggiunge anche uno stato selezionato dedicato per i trigger delle schede, consentendo lo styling delle schede attive utilizzando controlli atomici standard senza CSS o JavaScript personalizzati.
Interazioni d’ingresso
Elementor 3.34 introduce le Interazioni d’ingresso, la prima implementazione del nuovo sistema atomico basato sull’Interaction Design, incentrato su movimenti leggeri e orientati alle prestazioni.
Gli elementi atomici ora includono una scheda Interazioni dedicata che separa la logica comportamentale dalla struttura e dallo stile, stabilendo una base chiara per le future capacità di interazione.
Le Interazioni di ingresso attualmente supportano animazioni attivate al caricamento della pagina o quando gli elementi entrano nel viewport, con movimenti configurati tramite proprietà granulari quali tipo di effetto, direzione, durata e ritardo.
È possibile sovrapporre più effetti di ingresso su un singolo elemento e ogni Interazione include un controllo di anteprima per riprodurre le animazioni direttamente sulla tela.
Altri miglioramenti dell’editor V4
Questa versione include diversi miglioramenti fondamentali che aumentano la coerenza nell’editor. Gli elementi atomici sono ora automaticamente racchiusi in un contenitore Flexbox Atomico, che sostituisce il vecchio elemento Contenitore V3 e garantisce un markup più pulito, un comportamento del layout più prevedibile e una struttura completamente atomica dall’inserimento in poi.
Le condizioni di visualizzazione sono ora supportate direttamente nella scheda generale degli Elementi Atomici, fornendo un flusso di lavoro unificato per il controllo della visibilità.
Il CSS personalizzato ora supporta le media query in modalità desktop, consentendo una logica avanzata dei breakpoint.
L’elemento Paragrafo è stato esteso con il supporto inline span per uno stile semantico del testo più raffinato.
Miglioramenti nel campo dell’Accessibilità
Elementor 3.34 continues to refine accessibility across widgets, focusing on reducing noise in assistive technologies and aligning output with accessibility best practices.
Flip Box: icone decorative nascoste agli screen reader
In questa versione, le icone decorative nel widget Flip Box sono state rimosse dall’albero di accessibilità, impedendo che vengano annunciate dagli screen reader come immagini.
Queste icone non trasmettono alcun significato semantico e hanno esclusivamente scopo decorativo; la loro visualizzazione causava in precedenza un’inutile verbosità per gli utenti di screen reader.
Con questa modifica, l’output di Flip Box è ora coerente con gli altri widget, in cui gli elementi visivi decorativi sono esclusi per impostazione predefinita, garantendo una navigazione più pulita e mirata per gli utenti che utilizzano tecnologie assistive.
Modifiche e correzioni aggiuntive
Oltre alle funzionalità principali, Elementor 3.34 include un’ampia serie di miglioramenti e correzioni sia nella versione gratuita che in quella Pro.
Questi aggiornamenti migliorano la coerenza dell’output frontend, perfezionano i controlli dell’editor e il comportamento dell’interfaccia utente, ampliano il supporto per le proprietà logiche CSS e il rendering RTL, estendono l’integrazione dei tag dinamici e risolvono i problemi relativi alle trasformazioni, agli stati di hover, alla rigenerazione della cache, alla localizzazione e alla compatibilità con PHP 8.4.
Insieme, tutte queste modifiche stabilizzano ulteriormente l’editor atomico e riducono l’attrito durante la compilazione con Editor V4.
In conclusione
Editor V4 è ancora in fase di sviluppo attivo e le funzionalità introdotte in Elementor 3.34 devono essere considerate sperimentali e non pronte per la produzione.
Il markup, le API e il comportamento potrebbero evolversi con il proseguire dello sviluppo, e i primi test e feedback giocano un ruolo fondamentale nel plasmare le future iterazioni degli elementi atomici, delle interazioni e dei sistemi di stili globali.
Elementor 3.34 rappresenta un altro passo avanti verso un editor completamente atomico e CSS-first, rafforzando le basi di quello che diventerà Editor V4.
