Visual composer su Wordpress: esempi e guida ai migliori page builder

Un grande aiuto alla diffusione di Wordpress e di altri CMS in questi anni è stato sicuramente dato dall’avvento dei visual composer, anche noti come page builder.

Con le dovute differenze e caratteristiche che li distinguono l’uno dall’altro, in generale possiamo definire un visual composer come uno strumento - un plugin, nel caso di Wordpress - che permette di creare pagine web tramite drag & drop, ossia trascinando e riposizionando i vari elementi (titoli, immagini, blocchi di testo, video, etc.) all’interno della pagina stessa.

Avere questa possibilità significa anche potersi slegare dai limiti di molti temi Wordpress, superando la “staticità” dei template e potendo creare pagine specifiche con layout completamente diversi (come spesso capita nel caso delle landing page), progettando l’intera struttura di una pagina e non solo il contenuto principale.

Ma significa soprattutto, una volta capito il funzionamento di base, rendersi autonomi rispetto al codice, perché proprio grazie all’interfaccia grafica basata come detto su sistemi drag & drop non c’è più necessità di dover scrivere il codice per comporre la pagina: è il page builder che si occuperà di tradurre in linguaggio di programmazione tutto quello che l’utente ha creato graficamente.

 

Cos'è Gutenberg di Wordpress?

Wordpress stesso da ormai qualche anno ha integrato nel proprio core “Gutenberg”, un editor visuale molto più potente del precedente. Grazie a questo è possibile elaborare layout più complessi del semplice contenuto testuale, utilizzando un sistema drag & drop di “blocchi” predefiniti e personalizzabili. Tuttavia al momento i visual composer di terze parti, pur non essendo nativi e avendo comunque dei limiti, risultano una soluzione molto più professionale e versatile di Gutenberg.

Va precisato che spesso parlando dei visual composer nasce un’incomprensione. Infatti, se da un lato è vero che questi strumenti permettono di “bypassare” la scrittura di codice, dall’altro non eliminano completamente la necessità di una conoscenza almeno basilare di HTML, CSS, Javascript, PHP e dei database, oltre che ovviamente di Wordpress stesso e dei suoi temi.

Anche solo per affiancare un testo ad un’immagine, in effetti, bisogna sapere che servirà una griglia basata su righe da dividere in colonne, dentro le quali si inseriranno poi i vari elementi. O che ad una certa risoluzione è meglio far scalare i due elementi uno sopra l’altro piuttosto che tenerli affiancati anche su schermi piccoli.

I page builder offrono spesso un’interfaccia abbastanza intuitiva, ma se non si masticano quantomeno i concetti basilari del web design sopra esemplificati, comprenderla risulterà all’inizio un’impresa abbastanza ostica.

 

Visual composer: tutorial e guide online

È anche vero che online si trovano veramente tante guide e tutorial sui visual composer, oltre a forum e servizi di assistenza dedicati, grazie ai quali si riesce a gestire la maggior parte delle situazioni in autonomia. Una volta capiti i concetti di base e fatta un po’ di esperienza, diventa molto più semplice e veloce comporre pagine dall’aspetto professionale.

I page builder integrano poi diverse librerie e impostazioni per andare anche oltre alla semplice composizione del layout, come ad esempio la possibilità di aggiungere animazioni ed effetti, nascondere o modificare a certe risoluzioni alcuni elementi, aggiungere add-on che estendono le possibilità di inserire facilmente elementi non compresi in quelli disponibili di base (o integrazioni con altri plugin).

Generalmente sono compatibili con gli altri plugin più usati (WooCommerce, WPML, Yoast etc.) e sono a pagamento, proprio per la complessità e libertà di azione che implicano questi strumenti, ma spesso ne esiste anche una versione free - con tutte le limitazioni del caso.

Tra i più usati e conosciuti troviamo: WPBakery Page Builder, Elementor, Beaver Builder, Divi Builder, ma con l’ampia diffusione di Wordpress il mercato è costantemente in espansione e aggiornamento.

 

Vantaggi e svantaggi dei visual composer

Senza dubbio per la maggior parte i visual composer sono ottimi strumenti grazie ai quali diventa più semplice realizzare siti web professionali dotati anche di qualche funzionalità di base (come un form di contatto ad esempio), anche per utenti privi di un background prettamente tecnico.

 

Quali sono quindi i vantaggi che offrono i visual composer?

 

Velocità realizzazione

Una volta presa confidenza con lo strumento scelto diventa molto più veloce la creazione di layout, anche grazie alla possibilità di salvare i template realizzati e riusarli per nuove pagine.

Semplicità di utilizzo

Questi plugin sono pensati sia per utenti esperti e professionisti del settore, sia per utenti alle prime armi. Spesso si ha a disposizione un editor back-end e uno front-end, consentendo all’utente di costruire la pagina nel pannello di amministrazione di Wordpress o direttamente nell’anteprima della pagina.

Relativa indipendenza dal codice

Limitandosi alle funzionalità base è possibile ottenere buoni risultati, ma per arrivare ad una personalizzazione maggiore e alla gestione di funzioni ed elementi complessi è necessario l’intervento di figure specializzate.

Estendere le possibilità del tema WP

Diventa possibile creare pagine con layout sempre diversi, slegandosi dalla struttura “fissa” di molti temi e dotando l’utente di maggiore autonomia rispetto al passato, anche grazie a moltissimi add-on disponibili.

 

Quali invece gli svantaggi?

 

Minori performance

Un visual composer o page builder è di fatto un software che installiamo dentro a Wordpress per permettere agli utenti di creare quasi ogni tipo di elemento, gestendo grafica, animazioni, effetti e diversi altri aspetti.

Ne consegue che il server dovrà gestire un codice più complesso e appesantito, con una netta diminuzione della velocità di caricamento rispetto ad un tema costruito su misura.

Dipendenza dal plugin

Tra il codice che questi plugin (anche se non tutti) generano, ci sono i cosiddetti shortcode, parti di codice che vengono poi tradotti in Wordpress per elaborare i layout ma che restano salvati nel contenuto della pagina, rendendolo illeggibile se si disabilita il plugin.

Questo implica un lavoro molto più oneroso per ricostruire le parti illeggibili nel momento in cui si abbandona il plugin o il tema usato. Anche il fatto di poter creare pagine una diversa dall’altra, senza agire globalmente sul template, rende impossibile fare una modifica rapida visualizzandola automaticamente su tutte le pagine (come ad esempio una semplice modifica di un margine o di un elemento).

Di conseguenza, bisognerà invece intervenire su ogni singola pagina.

Limiti del plugin

Sebbene i page builder possano aumentare anche di molto le possibilità nativamente fornite da Wordpress, per il raggiungimento di funzionalità più avanzate è comunque sempre necessario l’intervento di uno sviluppatore o comunque di un utente molto esperto. Spesso è infatti necessario sovrascrivere o aggiungere del codice per poter ottenere certe combinazioni che i vari plugin non sono in grado di gestire.

Aggiornamenti e compatibilità

È sempre importante controllare la compatibilità tra il visual composer scelto ed i plugin già installati sul sito (o che, comunque, verranno installati), oltre naturalmente a tenerli tutti aggiornati. Essendo infatti i page builder così diffusi e al tempo stesso realizzati con tanti file e righe di codice, spesso risultano vittime di attacchi da parte dei bot, mostrando vulnerabilità di sicurezza che devono essere eliminate proprio grazie ad aggiornamenti costanti e tempestivi.

 

Conviene usare i visual composer? 

Quando conviene quindi scegliere di usare un visual composer per il proprio sito Wordpress? Dipende.

Nella nostra web agency li consideriamo un ottimo strumento per realizzare velocemente landing page o comunque pagine “slegate” dalla struttura principale del sito, che deve risultare sempre solida e coerente sia a livello grafico che strutturale.

Mantenere tale coerenza risulta infatti più complesso se si pensa di costruire interi siti con questi plugin, magari affidando lo sviluppo a più persone con competenze e gusti differenti. La cosa diventa poi ancora più problematica se si progetta di migrare il contenuto in un futuro.

Ma in generale i page builder restano un validissimo aiuto sia per utenti con conoscenze basilari di Wordpress, sia per professionisti del settore o utenti esperti che necessitano di pagine efficaci da sviluppare o modificare velocemente.

Per concludere, qui è disponibile un video tutorial di WPBakery Page Builder per vedere con un esempio pratico come sia possibile creare in pochi minuti una semplice pagina Wordpress con un page builder.