Beaver Builder vs Divi 2022

Gli editor di What You See Is What You Get (WYSIWYG) sono stati un punto fermo nei software informatici sin dagli anni '70, ma nel mondo di WordPress stiamo vedendo sempre più proprietari di siti Web passare ai costruttori di pagine drag-and-drop per aiutarli a creare eleganti post di blog e pagine professionali.

Questa adozione si è intensificata da quando WordPress ha introdotto il nuovo editor di blocchi chiamato Gutenberg in WordPress 5.0 nel 2018. Naturalmente, l'editor classico è ancora disponibile per coloro che preferiscono il vecchio editor visivo.

Il nuovo editor di blocchi è gratuito, vanta un'interfaccia intuitiva e ha molti utili blocchi di contenuto disponibili per la selezione.

Adoro la semplicità dell'editor di blocchi di WordPress, ma non si può negare che sia una soluzione di base. I suoi blocchi di contenuto hanno poche opzioni di personalizzazione e non esiste un sistema di modelli integrato. Questo limita notevolmente ciò che puoi creare.

Se stai cercando di portare il tuo sito Web al livello successivo, ti consiglio di utilizzare una soluzione avanzata di creazione di pagine con trascinamento della selezione come Beaver Builder o Divi.

Questi plug-in WordPress reattivi ti offrono un maggiore controllo sullo stile dei post del blog, delle pagine e dei tipi di post personalizzati.

In questo articolo, vorrei mostrarti come si confrontano questi plugin per la creazione di pagine per aiutarti a vedere quale è il migliore per te e i tuoi progetti.

Una versione lite di Beaver Builder è disponibile su WordPress.org, ma poiché la versione gratuita manca di molte funzionalità, questo articolo si concentrerà invece sulla versione completa di Beaver Builder.

L'interfaccia di Beaver Builder

Beaver Builder è un editor frontend che può essere avviato da diverse aree di WordPress.

Quando crei un nuovo post del blog, una pagina o un tipo di post personalizzato all'interno dell'editor di blocchi di WordPress, vedrai un'opzione per "Avvia Beaver Builder" o "Usa editor standard".

Il pulsante "Avvia Beaver Builder" non viene visualizzato automaticamente nell'editor di Gutenberg. Appare solo quando aggiungi un blocco Beaver Builder alla tua pagina.

Se il blocco Beaver Builder non è disponibile, controlla la pagina delle impostazioni di Beaver Builder per assicurarti che il tipo di post corrispondente sia abilitato.

Beaver Builder può anche essere avviato dall'editor classico e dalla pagina di elenco principale di post, pagine e tipi di post personalizzati.

Una volta effettuato l'accesso, vedrai un'opzione per modificare una pagina anche nella barra di amministrazione di WordPress.

Quando Beaver Builder si carica, vedrai un menu sul lato destro che mostra i moduli disponibili. Qui vengono visualizzate anche le schede per righe, modelli e layout salvati.

Cliccando sul simbolo X in alto si chiude il menu, ma puoi ricaricare il menu cliccando sul simbolo + che ora viene visualizzato.

Nella parte in alto a destra della pagina, vedrai un promemoria che la tua pagina è stata modificata e ha modifiche non pubblicate. Se fai clic sul pulsante Fine, verranno visualizzate le opzioni che ti consentono di eliminare il layout, salvare la bozza o pubblicare il layout.

Il lato in alto a sinistra della pagina mostra il post, la pagina o il tipo di post personalizzato che stai modificando. Facendo clic su di esso verrà caricato il menu degli strumenti di Beaver Builder.

Ci sono molte impostazioni e funzionalità nascoste in questo menu.

Da qui puoi pubblicare il layout, salvare il layout come modello, duplicare il layout, vedere tutte le revisioni, controllare la cronologia delle modifiche e altro ancora.

Anche le impostazioni globali e le impostazioni Javascript e CSS sono accessibili da questo menu e la parte inferiore del menu mostra i collegamenti all'area di amministrazione di WordPress e alle pagine di supporto.

A destra del menu degli strumenti c'è una campana di notifica che mostra gli aggiornamenti dei plugin e gli ultimi post del blog Beaver Builder.

Per aggiungere un nuovo modulo o una nuova riga al layout, trascinalo semplicemente nell'area principale della tela.

Sono disponibili diverse impostazioni di colonna preconfigurate per le righe insieme a layout di colonna salvati, righe salvate e righe predefinite.

Dopo aver aggiunto nuove righe, sulla tua pagina viene visualizzato uno schema della struttura. Puoi trascinare e rilasciare un modulo di contenuto in una di queste caselle.

Nella parte in alto a sinistra di righe e moduli, vedrai le opzioni per spostare l'elemento in un'altra parte del layout. La riga o il modulo in questione possono anche essere duplicati o eliminati da qui.

Righe e colonne hanno un pulsante delle impostazioni e un pulsante delle azioni che consente di reimpostare le larghezze di righe e colonne.

Ampiezze, colori, sfondi, bordi e altro possono essere regolati nella scheda stile della finestra delle impostazioni. Oltre ai margini e al riempimento, la scheda avanzata consente di limitare la visibilità agli utenti che hanno effettuato l'accesso e di regolare il punto di interruzione per gli utenti mobili.

Ci vuole un po' di tempo per familiarizzare con qualsiasi page builder di WordPress, tuttavia Beaver Builder è senza dubbio una delle soluzioni più facili da raccogliere. È anche uno dei più veloci, con le modifiche apportate al caricamento quasi istantaneamente.

Beaver Builder ti consente di modellare ogni aspetto del tuo layout, ma come vedrai, Divi offre molte più opzioni di personalizzazione durante la creazione di layout.

L'interfaccia di Divi Builder

Temi eleganti usano la parola Divi per descrivere sia il loro popolare tema WordPress che il generatore di pagine drag-and-drop.

Questo crea un po' di confusione tra coloro che sono nuovi a Elegant Themes, motivo per cui a volte distinguono i prodotti chiamando il design "Divi Theme" e il page builder "Divi Builder".

Per ora, vorrei concentrarmi su Divi Builder. Questo generatore di pagine è incorporato in Divi Theme ma è anche disponibile come plug-in WordPress autonomo per coloro che desiderano utilizzarlo con altri temi WordPress.

Una volta attivato Divi Builder, vedrai un'opzione per "Usa Divi Builder" quando aggiungi un nuovo post, pagina o tipo di post personalizzato.

Questo avvierà il visual builder front-end, ma sarà disponibile anche un editor back-end chiamato Legacy Builder.

Puoi passare a Divi Builder in qualsiasi momento dall'editor di blocchi predefinito di WordPress.

Divi Builder può anche essere avviato dalle pagine di elenco principali di post, pagine e tipi di post personalizzati.

Come Beaver Builder, se hai effettuato l'accesso, vedrai un'opzione per abilitare Divi Builder dalla barra di amministrazione di WordPress.

I temi eleganti hanno anche un blocco layout Divi.

Questo blocco ti consente di inserire qualsiasi layout Divi direttamente in un layout che hai creato con l'editor di blocchi di WordPress predefinito.

Quando avvii Divi Builder per la prima volta, ti verrà chiesto se desideri creare un layout da zero, scegliere un layout predefinito o clonare un'altra pagina che hai già creato.

Se inizi da zero, Divi Builder caricherà la tua tela vuota e visualizzerà una casella per inserire una nuova riga.

Sono disponibili 20 righe per la selezione e ognuna ha una struttura di colonne diversa.

Dopo aver inserito una riga, Divi Builder ti chiede di selezionare un modulo da aggiungere alla tua pagina.

Divi Builder carica quindi la casella delle impostazioni per il modulo selezionato.

Se non conosci Divi Builder, ti consiglio di familiarizzare con il funzionamento dell'editor selezionando un layout predefinito, poiché ti dà qualcosa con cui giocare.

Gli utenti esperti potrebbero preferire iniziare con un'area vuota, ma tieni presente che il menu principale non viene caricato automaticamente quando selezioni questa opzione.

Per caricare il menu principale, clicca sul pulsante con i tre punti orizzontali in fondo alla pagina.

Le opzioni del menu principale sono divise in tre colonne.

Puoi caricare le impostazioni del builder tramite l'icona dei tre punti verticali sul lato sinistro del menu.

Da qui è possibile aggiungere tre diverse modalità di visualizzazione al menu: modalità al passaggio del mouse, modalità clic e modalità griglia. Queste modalità cambiano il modo in cui interagisci con il tuo layout e apporti modifiche. Ad esempio, in modalità al passaggio del mouse, il semplice passaggio del mouse su una parte della pagina evidenzierà moduli, colonne, righe e sezioni e potrai quindi apportare modifiche.

Altre impostazioni nella casella delle impostazioni del builder includono la modalità di visualizzazione predefinita, l'intervallo di stato della cronologia e il flusso di creazione della pagina.

Se hai creato un layout complesso, potrebbero verificarsi situazioni in cui viene evidenziata la parte sbagliata della pagina. Ad esempio, potresti voler spostare una colonna, ma selezioni accidentalmente la riga a cui appartiene.

Un modo per risolvere questo problema è utilizzare la modalità di visualizzazione wireframe. Questo rimuove gli elementi di design non necessari dalla tua vista per aiutarti a vedere più facilmente la struttura della tua pagina. È incredibilmente utile quando si spostano le cose all'interno di un layout complesso.

Il lato sinistro del menu ha anche opzioni per farti vedere il tuo design nella visualizzazione desktop, tablet e mobile.

Ci sono sette opzioni nel menu centrale. Il pulsante X al centro chiude il menu.

Sulla sinistra, puoi caricare un layout dalla libreria, salvare il layout corrente e cancellare il layout. Sulla destra, puoi visualizzare le impostazioni della pagina, la cronologia delle modifiche e la portabilità.

La casella delle impostazioni del post/della pagina ti consente di modificare il titolo, l'estratto, l'immagine in primo piano e le categorie. Anche qui sono disponibili una serie di impostazioni di progettazione, come spaziatura, tavolozza dei colori, CSS personalizzato e visibilità.

La casella della cronologia delle modifiche ti consente di annullare e ripristinare facilmente le modifiche recenti e di visualizzare una cronologia completa di tutte le modifiche apportate.

I layout possono essere esportati e importati in formato JSON tramite la casella delle impostazioni di portabilità. Questo è utile per trasferire i layout ad altri siti web.

Il tuo layout può essere salvato e pubblicato sul lato destro della pagina.

I tutorial video e le scorciatoie da tastiera possono essere visualizzati anche tramite la casella Divi Helper in quest'area. C'è anche una funzione di ricerca che ti aiuta a trovare funzionalità e documentazione.

Le interfacce utente per Beaver Builder e Divi Builder funzionano in modo diverso, tuttavia quando si tratta di regolare righe e colonne, funzionano in realtà in modo simile.

Entrambe le soluzioni mostrano le impostazioni nell'angolo in alto a sinistra e ti consentono di spostare, duplicare e regolare righe e colonne. Divi, tuttavia, ha più opzioni di personalizzazione.

Divi Builder ha un elemento sopra le righe, chiamato sezioni.

Le sezioni possono contenere più righe e ogni riga può contenere più colonne. Ti dà un po' di flessibilità in più con il modo in cui costruisci le pagine.

Nelle versioni precedenti di Divi Builder, i layout venivano creati direttamente dall'editor di WordPress, tuttavia il visual builder frontend è ora il modo standard per creare layout con Divi.

Per fortuna, il vecchio editor è ancora disponibile in Divi Builder.

Per attivare il Legacy Builder, devi prima accedere alla sezione avanzata dell'area delle opzioni del plug-in Divi, disabilitare l'ultima esperienza di Divi Builder e abilitare l'editor classico.

L'interfaccia utente di Legacy Builder è simile alla modalità di visualizzazione wireframe disponibile nell'editor visivo.

Sebbene non ti permetta di visualizzare in anteprima le modifiche apportate in tempo reale, adoro quanto sia veloce ed efficiente. Tutto si carica un po' più velocemente rispetto all'editor frontend ed è più facile vedere la struttura della tua pagina.

Beaver Builder carica tutto un po' più velocemente di Divi Builder e la sua interfaccia utente è più facile da acquisire, tuttavia Divi Builder offre molte più impostazioni di personalizzazione e funzionalità aggiuntive che mancano in Beaver Builder.

L'inclusione della modalità wireframe e Legacy Builder rende probabilmente Divi Builder anche una soluzione più flessibile.

Per uno sguardo più completo su come funziona Divi Builder, dai un'occhiata alla nostra recensione completa di Divi Builder.

Layout predefiniti di Beaver Builder

Sono un grande fan dei layout predefiniti in quanto riducono notevolmente il tempo necessario per creare contenuti eleganti. Ti aiutano anche a capire come creare layout avanzati.

Beaver Builder non offre tanti layout predefiniti come Divi, ma la qualità di ogni modello è altrettanto alta.

I modelli di pagina di destinazione e i modelli di pagina di contenuto sono disponibili nella scheda modelli del menu del contenuto principale insieme a tutti i modelli salvati in tuo possesso.

I modelli di pagina di destinazione sono modelli completi a pagina intera. Sono disponibili un totale di 15 modelli di pagina di destinazione insieme a un modello di pagina di tela vuota.

Esistono modelli per piccole imprese, palestre, avvocati, musicisti, fotografi, ristoranti, eBook e altro ancora.

Quando selezioni un modello di pagina di destinazione, ti viene chiesto se desideri sostituire il layout esistente o aggiungerlo a quello che già possiedi.

I layout predefiniti vengono inseriti nel layout in pochi secondi.

Una volta aggiunti, puoi modificarli come meglio credi e salvarli come modelli personalizzati.

I modelli di pagina di contenuto sono modelli universali per parte di una pagina adatti a qualsiasi tipo di sito web.

Sono disponibili 25 modelli di pagine di contenuto. Sono disponibili layout per aiutarti a inserire un'area, informazioni sul team, servizi, modulo di contatto, tabelle dei prezzi, modulo di iscrizione e altro ancora.

Beaver Builder offre anche dozzine di righe predefinite. Questi layout possono essere facilmente inseriti in qualsiasi parte della tua pagina.

Li troverai nelle schede delle righe del menu del contenuto principale.

Se utilizzi il sistema di creazione di modelli di Beaver Builder, puoi ridurre notevolmente il tempo necessario per creare nuovi layout.

I layout possono essere salvati in qualsiasi momento e riutilizzati tutte le volte che si desidera.

Tutti i modelli salvati possono essere gestiti dal menu di amministrazione principale di Beaver Builder e modificati in seguito, se necessario.

Puoi salvare modelli, righe, colonne e moduli e ogni layout salvato può essere assegnato a categorie.

Beaver Builder ha fatto un lavoro fantastico integrando i layout predefiniti nella loro interfaccia utente. I layout possono essere inseriti in pochi secondi e le personalizzazioni possono essere salvate e utilizzate più e più volte.

Layout predefiniti Divi

Come Beaver Builder, Divi offre agli utenti un'ampia varietà di layout predefiniti.

Sono disponibili per la selezione oltre 1.100 pacchetti di layout.

150 di questi layout sono pacchetti di layout che includono design per una serie di aree del tuo sito Web come la tua pagina informazioni, blog, pagina di destinazione e galleria.

Come notato in precedenza, quando avvii Divi Builder su una nuova pagina, una delle opzioni disponibili è quella di scegliere un layout predefinito.

La Libreria Divi può anche essere caricata dal menu principale.

Divi Library ti consente di inserire layout predefiniti, layout salvati e pagine intere.

Puoi restringere la ricerca di un layout adatto utilizzando la casella di ricerca o selezionando una delle 13 categorie a cui sono assegnati i layout.

Assicurati di salvare il layout corrente prima di inserire un layout predefinito, poiché Divi Builder lo sovrascriverà.

I pacchetti di layout evidenziano tutti i layout inclusi nel pacchetto, tuttavia ti consiglio vivamente di fare clic sul pulsante "Visualizza demo dal vivo" per vedere esattamente come apparirà il tuo sito web se selezioni un design.

Per aiutare a illustrare questo punto, dai un'occhiata all'area demo per il design di Divi Web Freelancer mostrata nello screenshot qui sotto.

A seconda della configurazione dell'hosting, Divi Builder può impiegare fino a un minuto per importare tutti i layout in un pacchetto di layout.

Dopo aver inserito un layout nella tua pagina, puoi personalizzarlo e renderlo tuo cambiando i colori, aggiungendo moduli e rimuovendo sezioni che non sono rilevanti per te.

I layout possono essere salvati nella Libreria Divi in ​​qualsiasi momento dal menu Divi principale.

Puoi nominare ogni layout e raggrupparli in categorie.

Il menu di amministrazione di Divi si collega alla pagina principale delle opzioni del plug-in, a Divi Theme Builder, alla Libreria Divi e ad alcune altre pagine delle impostazioni (di cui parleremo in seguito).

Divi Theme Builder è uno strumento fantastico che ti consente di creare modelli di pagina personalizzati. Puoi quindi assegnare i modelli a post, pagine e tipi di post personalizzati.

Per ogni modello, puoi assegnare un layout all'intestazione, al corpo e al piè di pagina. Puoi quindi specificare esattamente quali aree del tuo sito web dovrebbero essere utilizzate da questi modelli.

Ad esempio, potresti creare un design unico per il tuo blog, ma escluderlo da determinate categorie di post. Puoi anche creare modelli unici per la pagina dei risultati di ricerca, la pagina 404, gli archivi, la home page e altro ancora.

Tutti i layout salvati possono essere visualizzati dalla pagina "Libreria Divi" che è collegata al menu principale di amministrazione Divi.

I layout possono essere importati ed esportati da questa pagina. Puoi anche gestire le tue categorie di layout da qui.

Quando fai clic per modificare un layout dalla pagina principale della Libreria Divi, verrai indirizzato a una panoramica del tuo progetto in modalità di visualizzazione wireframe.

Questa modalità è utile per regolare la struttura del layout, ma se desideri apportare modifiche più specifiche, puoi passare alla visualizzazione desktop, tablet o telefono. In questo modo puoi modificare il layout salvato utilizzando l'editor visivo.

Se preferisci, puoi avviare il normale editor visivo del frontend e apportare personalizzazioni sulla pagina stessa.

Fianco a fianco, non credo che la qualità dei layout predefiniti di Divi Builder sia migliore dei design disponibili in Beaver Builder, tuttavia l'intera configurazione in Divi Builder è significativamente migliore.

I pacchetti di layout di Divi Builder ti offrono fino a una dozzina di modelli per aiutarti a creare un sito Web completo, mentre Beaver Builder offre solo layout e layout a pagina singola per sezioni specifiche della tua pagina.

C'è molta più scelta anche in Divi Builder, con il plug-in che offre 950 modelli di pagina di destinazione rispetto ai 15 di Beaver Builder. Anche per Divi è disponibile un'ampia selezione di layout di terze parti.

È importante notare, tuttavia, che Beaver Builder tende a inserire i layout nella tua pagina un po' più velocemente di Divi Builder.

Dai un'occhiata alla pagina dei layout Divi per vedere quali layout predefiniti sono disponibili con Divi Builder.

Moduli di contenuto di Beaver Builder

Un totale di 29 moduli sono disponibili in Beaver Builder. I moduli sono divisi in sei categorie: Basic, Media, Actions, Layout, Info e Posts.

C'è una buona varietà di moduli per l'aggiunta di contenuti avanzati, la regolazione del layout e l'estrazione di contenuti dal tuo blog.

Uno dei moduli nella categoria layout è il modulo della barra laterale, che permette di inserire i widget di WordPress. Questo apre molte possibilità per integrare le funzionalità nei tuoi layout da altri plugin di WordPress.

Quando un modulo è stato trascinato e rilasciato nell'area della tua tela, apparirà la sua finestra delle impostazioni.

Troverai impostazioni comuni in tutti i moduli per lo stile, la spaziatura, la visibilità, le animazioni e altro, tuttavia ogni modulo ha impostazioni uniche per consentirti di modificare ciò che viene visualizzato.

Ad esempio, nel modulo mappa, ci sono campi per inserire l'indirizzo della mappa, l'altezza della mappa e l'attributo del titolo della mappa.

Beaver Builder non ha la più grande raccolta di moduli di contenuto e non offre tante opzioni di personalizzazione come Divi.

Credo, tuttavia, che Beaver Builder abbia tutto il necessario per creare bellissimi layout, poiché le funzionalità mancanti possono essere inserite nei layout tramite i widget di WordPress.

Moduli di contenuto di Divi Builder

38 moduli di contenuto sono disponibili per la selezione in Divi Builder.

Oltre a moduli essenziali come immagini, video, portfolio e testimonianze, ci sono moduli utili per aggiungere banconi bar, blurb, slider e call to action.

Divi Builder aggiunge anche un nuovo tipo di post personalizzato per i progetti.

Come Beaver Builder, Divi ha un modulo barra laterale in modo da poter integrare i widget di WordPress nei tuoi layout.

Divi Builder utilizza un sistema di codici colore per aiutarti a creare layout eleganti.

Le sezioni sono blu, le righe sono verdi e i moduli sono grigio scuro (quasi nero).

Puoi aggiungere un nuovo modulo passando il mouse sopra una colonna e facendo clic sul pulsante "Aggiungi nuovo modulo".

Come ho mostrato in precedenza, quando selezioni un modulo, la finestra delle impostazioni del modulo apparirà automaticamente in modo che tu possa inserire valori e regolare lo stile.

Eventuali personalizzazioni apportate possono essere salvate nella Libreria Divi. Questo può farti risparmiare molto tempo durante la creazione delle pagine.

Ad esempio, puoi modificare il modulo della mappa in modo che visualizzi una mappa dell'indirizzo della tua azienda. Puoi quindi salvare facilmente la mappa e inserirla nella tua pagina delle informazioni, nel modulo di contatto, nei post del blog e altro ancora.

Divi Builder offre più opzioni di stile e personalizzazione rispetto a Beaver Builder e ha nove moduli di contenuto aggiuntivi, ma non credo che nessuno si sentirà limitato a ciò che è disponibile in entrambi i plugin di WordPress, in particolare perché i widget di WordPress possono essere inseriti nei layout utilizzando il modulo della barra laterale.

Configurazione di Beaver Builder

La finestra delle impostazioni globali può essere caricata dal menu degli strumenti all'interno dell'interfaccia utente di Beaver Builder.

Ti consente di abilitare e disabilitare l'intestazione della pagina, i margini e il riempimento di righe, colonne e moduli. I layout reattivi possono anche essere modificati da quest'area e ci sono caselle per inserire codice CSS e Javascript.

La pagina principale delle impostazioni di Beaver Builder è divisa in diverse sezioni.

Per ricevere gli aggiornamenti automatici dei plug-in, devi inserire la tua chiave di licenza nella sezione della licenza. I moduli e i tipi di post possono essere abilitati e disabilitati nella sezione successiva.

L'accesso al sistema di modelli può essere modificato nella sezione successiva. Puoi abilitare i modelli principali, i modelli utente o tutti i modelli. I modelli possono anche essere disabilitati.

L'area delle impostazioni di accesso utente consente di definire quali gruppi di utenti di WordPress possono utilizzare Beaver Builder. Le autorizzazioni sono suddivise in cinque diverse aree, come l'accesso al builder e al menu di amministrazione di Beaver Builder.

La pagina delle impostazioni generali ti consente anche di abilitare e disabilitare i set di icone, il marchio del plug-in, il marchio del tema e le impostazioni della guida. La memorizzazione nella cache e il debug sono disponibili nella sezione strumenti.

Consiglio di controllare la pagina delle impostazioni di Beaver Builder dopo aver installato Beaver Builder, ma la maggior parte della personalizzazione che farai avviene all'interno dell'interfaccia principale di Beaver Builder.

Configurazione di Divi Builder

Come Beaver Builder, la maggior parte del tuo tempo sarà dedicato alla personalizzazione dei layout all'interno dell'editor Divi Builder stesso, ma ci sono alcune impostazioni importanti che possono essere trovate dal menu principale di amministrazione di Divi.

La pagina principale delle opzioni del plug-in ha una scheda per inserire il nome utente e la chiave API di Elegant Themes. È necessario completare questa operazione per ricevere gli aggiornamenti automatici del plug-in.

Nella scheda successiva, puoi inserire la tua chiave API di Google. Ciò è necessario se si desidera utilizzare il modulo mappa. Google Fonts può essere disabilitato anche da questa pagina.

La scheda successiva ti consente di abilitare e disabilitare Divi Builder per specifici tipi di post di WordPress. Questo è utile se vuoi limitare l'accesso a Divi Builder per alcuni tipi di post come la tua galleria.

Nella scheda Avanzate, puoi abilitare e disabilitare la minimizzazione CSS e Javascript. Qui è anche dove puoi abilitare l'editor Legacy Builder.

Divi Builder ti dà il controllo completo su ciò che ogni gruppo di utenti sul tuo sito Web può e non può fare.

Mentre Beaver Builder ti consente di limitare l'accesso ad alcune aree chiave, Divi Builder ti consente di definire esattamente a quali funzionalità possono accedere gli utenti.

Ad esempio, puoi impedire agli utenti di caricare layout o disabilitare le funzionalità all'interno di Divi Builder.

Il centro di supporto di Divi fornisce un rapporto sul tuo sistema. Questo può aiutarti a diagnosticare eventuali problemi con la configurazione dell'hosting.

Ad esempio, per il mio sito Web WordPress di prova, il rapporto ha mostrato che la mia installazione di WordPress aveva una quantità limitata di risorse.

L'accesso remoto è disponibile anche in questa pagina. Questo può aiutare il team di supporto di Elegant Themes a risolvere eventuali problemi che hai con Divi Builder.

Il centro di supporto ha anche collegamenti a utili tutorial video e c'è una modalità provvisoria che disabilita le funzionalità che potrebbero causare problemi con altri plugin e temi di WordPress.

Gli errori vengono visualizzati anche in questa pagina, se WP_DEBUG_LOG è abilitato.

Divi Builder è un semplice plugin per WordPress da configurare, con solo poche impostazioni da controllare dopo l'installazione.

La caratteristica principale nell'area delle impostazioni è il Divi Role Editor. È qualcosa che apprezzeranno i proprietari di grandi siti Web WordPress con più dipendenti.

Il tema del costruttore di castori

Beaver Builder Theme è un framework HTML5 e Bootstrap WordPress incluso nei piani Beaver Builder Pro e Agency.

È un design WordPress minimale che funge da tela bianca per la creazione di progetti con Beaver Builder. Hook e filtri sono disponibili all'interno del tema per aiutare gli sviluppatori a modificare il design del sito Web e ha un ottimo supporto per WooCommerce.

Tutte le impostazioni per il tema Beaver Builder sono contenute nel Customizer di WordPress.

Lo stile e la posizione possono essere regolati per dozzine di aree della tua pagina. Ci sono anche layout per l'intestazione, il menu di navigazione, il blog, gli archivi, i post del blog, le pagine WooCommerce e il piè di pagina.

Sebbene al suo interno, Beaver Builder rimanga un tema WordPress minimale, gli sviluppatori hanno fatto il possibile per aggiungere molte opzioni di personalizzazione extra.

Prendi ad esempio il logo del tuo sito web. Puoi caricare un'immagine del logo normale, una per i dispositivi retina, i loghi in dissolvenza per i dispositivi normali e i dispositivi retina e un altro logo per i dispositivi mobili.

In molti altri temi WordPress, diverse parti del design come l'intestazione, la barra laterale e il piè di pagina possono impedire a Beaver Builder di visualizzare correttamente i layout. Questo è il motivo per cui molti utenti di Beaver Builder sono passati al tema Beaver Builder.

È un'ottima scelta se stai cercando di utilizzare i layout di Beaver Builder sul tuo sito web.

Il tema Divi

Beaver Builder commercializza il proprio design come tema framework per Beaver Builder, mentre Elegant Themes commercializza Divi Theme come un tema WordPress all-in-one versatile.

Ciò evidenzia quanto il marketing possa essere influente poiché ci sono più somiglianze tra il tema Beaver Builder e il tema Divi di quanto la gente pensi.

All'inizio, Divi era un tema WordPress all-in-one, tuttavia la maggior parte della versatilità associata a Divi Theme è stata successivamente migrata su Divi Builder. Questa era senza dubbio la cosa giusta da fare.

Quindi, con la maggior parte delle funzionalità incorporate in Divi Builder, Divi Theme può essere considerato un framework come Beaver Builder Theme. Pertanto, se possiedi entrambi i prodotti, puoi utilizzare Divi Theme con Beaver Builder o Beaver Builder Theme con Divi Builder.

Una volta attivato il tema Divi, vedrai alcune sottili modifiche nel menu di amministrazione di Divi.

Ciò include la sostituzione della pagina delle opzioni del plug-in con una pagina delle opzioni del tema e un collegamento al Customizer di WordPress.

A parte l'espansione dell'area delle impostazioni, tutto il resto rimane lo stesso.

È interessante notare che se Divi Theme è attivato, il plug-in Divi Builder verrà automaticamente disattivato. Ciò è necessario poiché la funzionalità di Divi Builder è integrata direttamente in Divi Theme (e nel tema Extra WordPress di Elegant Themes).

Troverai centinaia di opzioni utili all'interno del Personalizzatore di WordPress, distribuite su una dozzina di sezioni. Questi possono essere utilizzati per controllare aree come intestazione, piè di pagina e barre laterali.

L'area del contenuto principale per post, pagine e tipi di post personalizzati è ancora controllata da Divi Builder.

Quando si tratta di personalizzare il design del tuo sito web, non credo che Divi Theme sia migliore o peggiore di Beaver Builder Theme. Ci sono alcune aree in cui Divi Theme ti offre più opzioni e alcune aree in cui Beaver Builder Theme offre di più.

Tutte le opzioni del plug-in di Divi Builder sono state integrate nell'area delle opzioni più ampia di Divi Theme.

Ad esempio, le impostazioni del tipo di post sono ora disponibili nella scheda builder e le opzioni dalla pagina delle impostazioni avanzate si trovano ora nella pagina delle opzioni generali.

La pagina delle impostazioni generali ha anche campi per le icone dei social media, lo scorrimento, il codice CSS personalizzato e altro ancora.

Ulteriori opzioni sono disponibili anche per gli utenti di Divi Theme.

C'è un'area dedicata alle opzioni per il menu di navigazione del tuo sito web e una pagina di layout in cui puoi indicare quali funzionalità dovrebbero essere abilitate su post e pagine.

Ci sono anche pagine per aggiungere un banner da 468×60 pixel e dettagli SEO generali sul tuo sito web.

Come Beaver Builder Theme, Divi Theme è un tema WordPress minimo che è stato ottimizzato per l'uso con Divi Builder.

Consiglio vivamente di utilizzare questo design se si desidera sfruttare la vasta gamma di layout predefiniti di Divi.

Il costo di Beaver Builder

Caratteristiche e funzionalità sono due fattori che devi considerare quando esamini Beaver Builder e Divi, tuttavia devi anche considerare il costo di questi prodotti e il budget che hai a disposizione per i tuoi progetti.

Molte aziende premium di WordPress addebitano di più per l'utilizzo dei loro prodotti su siti Web aggiuntivi. Ad esempio, il piano base può supportare un sito Web, il piano intermedio può supportare tre siti Web e il piano avanzato può supportare dieci siti Web.

Beaver Builder ed Elegant Themes sono più generosi, offrendo supporto e aggiornamenti per un numero illimitato di siti web.

Sebbene questo articolo si sia concentrato principalmente sulla versione premium di Beaver Builder, consiglierei comunque di dare un'occhiata a Beaver Builder Lite.

È una buona soluzione per siti Web semplici e ti aiuta anche a vedere come funziona l'interfaccia di Beaver Builder.

Tieni presente, tuttavia, che la versione gratuita di Beaver Builder manca di moduli utili come il modulo di contatto, la tabella dei prezzi e la mappa. There is no access to the Beaver Builder templating system or pre-made layouts either.

For the vast majority of projects, the full version of Beaver Builder is a better fit than the lite version.

Three different premium plans are available: Standard, Pro, and Agency. All plans come with one year of premium support and access to premium modules and templates.

The standard plan retails at $99 per year. To get WordPress multisite support and access to the Beaver Builder Theme, you need to upgrade to the $199 per year Pro plan.

The $399 per year Agency plan adds white labeling. Web design companies may be interested in this plan as it allows you to rebrand the plugin as your own and change all references to Beaver Builder in templates and the admin area.

Beaver Builder offre una garanzia di rimborso di 30 giorni.

Tutti i membri di Beaver Builder ricevono anche uno sconto del 40% dopo un anno. Ciò riduce il prezzo dei piani di Beaver Builder negli anni successivi a $ 59,40 all'anno, $ 119,40 all'anno e $ 239,40 all'anno.

Se non sei sicuro di qualsiasi aspetto dell'utilizzo di Beaver Builder, ti consiglio vivamente di controllare la loro base di conoscenza dettagliata. Puoi anche chiedere aiuto tramite il supporto per i biglietti e nel forum della community di Beaver Builder, nel gruppo Facebook di Beaver Builder e nella stanza Slack di Beaver Builder.

Il costo di Divi

La politica dei prezzi di un abbonamento a Elegant Themes è più semplice.

Sono disponibili due piani ed entrambi i piani ti danno pieno accesso a tutti i prodotti Elegant Themes.

L'abbonamento annuale a Elegant Themes costa $ 89 all'anno.

Come Beaver Builder, puoi continuare a utilizzare prodotti come Divi Builder una volta scaduta la tua iscrizione, tuttavia non riceverai supporto e aggiornamenti se non rinnovi.

Se pensi di rinnovare la tua iscrizione per alcuni anni, potresti prendere in considerazione l'idea di ottenere il piano di accesso a vita. Per una tariffa una tantum di $ 249, riceverai accesso, supporto e aggiornamenti a vita per tutti i prodotti Elegant Themes.

Elegant Themes offre anche una garanzia di rimborso di 30 giorni a tutti i nuovi clienti.

Per aiutarti a capire meglio i loro prodotti, Elegant Themes ha creato una delle aree di documentazione più estese che abbia mai visto. Esistono centinaia di tutorial scritti e tutorial video che spiegano come funzionano i temi e i plugin di Elegant Themes per WordPress.

I membri possono anche richiedere aiuto tramite il supporto per i biglietti e c'è anche un ampio forum della community, una rete Meetup e un popolare gruppo Facebook.

Confrontare il costo di Beaver Builder e Divi è difficile in quanto hanno modelli di prezzo leggermente diversi.

Nonostante sia più limitato, apprezzo il fatto che sia disponibile una versione gratuita di Beaver Builder, poiché Beaver Builder Lite è sufficiente per blog di base e semplici progetti di siti Web.

Credo, tuttavia, che la versione completa di Beaver Builder sia l'opzione migliore per la maggior parte degli utenti di WordPress.

A $ 99, una licenza standard per Beaver Builder costa $ 10 in più rispetto a Elegant Themes, tuttavia i rinnovi successivi vengono addebitati a soli $ 59,40 all'anno.

Questo è uno sconto generoso per i membri fedeli, tuttavia un piano a vita di Elegant Themes potrebbe comunque risultare più economico per molti proprietari di siti web.

Un abbonamento a Elegant Themes include anche Divi Theme, mentre dovrai pagare $ 199 per accedere al Beaver Builder Theme.

Ancora più importante, un abbonamento a Elegant Themes include cinque prodotti di alta qualità: Divi Theme, Divi Builder, il tema della rivista WordPress Extra, il plug-in WordPress per l'attivazione dell'e-mail Bloom e il plug-in WordPress per i social media Monarch.

Per questo motivo, credo che un abbonamento a Elegant Themes offra un miglior rapporto qualità-prezzo per la maggior parte degli utenti di WordPress.

Pensieri finali

I costruttori di pagine drag-and-drop possono aiutare gli utenti di WordPress a creare splendidi layout di siti Web in pochi minuti tramite un'interfaccia intuitiva.

In un articolo di confronto come questo, è mia responsabilità mostrare i punti di forza e di debolezza sia di Beaver Builder che di Divi, tuttavia è importante ricordare che entrambe queste soluzioni sono prodotti raffinati e ci sono molte somiglianze tra loro.

Il processo di creazione di nuove righe e colonne è simile in entrambi i prodotti, ma ritengo che l'interfaccia di Beaver Builder sia più facile da imparare e anche un po' più veloce.

Divi offre molte più opzioni di personalizzazione e più layout predefiniti. Con cinque prodotti inclusi in un abbonamento a Elegant Themes, direi che offre anche un miglior rapporto qualità-prezzo.

Spero che il nostro sguardo approfondito su Beaver Builder e Divi ti sia piaciuto.

Per saperne di più su Beaver Builder, controlla la pagina di vendita ufficiale o leggi la nostra recensione completa di Beaver Builder. Puoi anche capire meglio come funziona Beaver Builder visitando la pagina demo di Beaver Builder o testando la versione gratuita del plugin.

Puoi scoprire come Divi sul sito Web di Elegant Themes e nella nostra recensione completa di Divi Builder. Sebbene non sia disponibile una versione gratuita di Divi Builder, puoi testare il plug-in nella pagina demo di Divi Builder. Questo ti aiuterà a vedere cosa può fare Divi Builder.

Grazie per aver letto.
Kevin