Elementor ha reso WordPress accessibile a tutti. Ha anche reso i siti WordPress lenti, gonfi e difficili da mantenere. C'è un'alternativa che mantiene la flessibilità senza il bloat: blocchi Gutenberg personalizzati costruiti in React.
Cos'è Gutenberg e perché è importante
Gutenberg è l'editor a blocchi di WordPress, introdotto nella versione 5.0. Invece di usare shortcode o drag-and-drop con builder esterni, Gutenberg costruisce le pagine assemblando blocchi. Ogni blocco è un componente React.
WordPress ha investito enormemente in Gutenberg. È il futuro dell'ecosistema WordPress, non un'alternativa di nicchia. I page builder come Elementor esistono nonostante Gutenberg, non grazie a lui.
I limiti dei blocchi standard
I blocchi standard di WordPress coprono le esigenze base: testo, immagini, gallerie, video, bottoni. Ma per un sito aziendale con esigenze specifiche, questi blocchi non bastano.
Vuoi un blocco "team" che mostri i membri dello staff con foto e ruoli? Non esiste. Vuoi un blocco "timeline" per la storia dell'azienda? Non esiste. Vuoi un blocco "calcolatore" per stimare un preventivo? Non esiste.
La soluzione tradizionale era Elementor o ACF con template personalizzati. Entrambe aggiungono peso e dipendenze.
Blocchi custom in React: cosa cambia
Un blocco Gutenberg custom è un componente React registrato come blocco WordPress. Ha:
- Un'interfaccia di editing nell'editor Gutenberg (lato admin) - Un output frontend ottimizzato per velocità e SEO - Attributi configurabili che l'editor può modificare senza toccare il codice
Per l'editor, l'esperienza è semplice: apre la pagina, aggiunge il blocco "Team", inserisce nome, ruolo e foto per ogni membro, salva. Il blocco si occupa del resto.
Per il sito, il risultato è HTML pulito e performante — senza jQuery, senza CSS di Elementor, senza script inutili.
Esempi pratici
Blocco Hero con video background: l'editor carica un video, sceglie testo e CTA dall'interfaccia Gutenberg. Il blocco genera HTML ottimizzato con lazy loading del video e fallback immagine.
Blocco Accordion FAQ: l'editor aggiunge domande e risposte dall'admin. Il frontend usa JavaScript vanilla per l'animazione — nessuna libreria extra.
Blocco Calcolatore preventivo: un form React che calcola in tempo reale e invia i risultati via email. Tutto nel blocco.
Blocco Team: schede per ogni membro con foto, nome, ruolo e link social. Completamente editabile dall'admin.
Quando conviene sviluppare blocchi custom
Conviene quando: - Hai componenti ripetuti su più pagine che devono essere editabili - Il tuo team di contenuti non sa usare il codice ma deve poter aggiornare il sito - Vuoi la flessibilità di un page builder senza il peso di Elementor - Stai costruendo un tema WordPress che altri useranno
Non conviene quando: - Il sito ha meno di 5 pagine e non cambierà frequentemente - Non hai un team di contenuti — in quel caso, dati statici nel codice sono più semplici
Il processo di sviluppo
1. Analisi: definiamo insieme quali blocchi servono e cosa deve essere editabile. 2. Sviluppo: costruiamo ogni blocco in React con la sua interfaccia Gutenberg. 3. Integrazione: integriamo i blocchi nel tema esistente o in un nuovo tema custom. 4. Documentazione: consegniamo una guida e un video per ogni blocco.
Sviluppa i tuoi blocchi Gutenberg custom con il nostro servizio dedicato.