Recensione di Oxygen Builder V 4.0: design, funzionalità e flusso di lavoro

Oxygen Builder 4.0 è qui e in questo articolo daremo un'occhiata a tutte le nuove funzionalità, modifiche e flussi di lavoro forniti con la nuova versione. Oxygen è un noto e apprezzato page builder di WordPress che sostituisce completamente il sistema di temi.

Negli ultimi due anni è stato sulla versione tre e ha visto grandi aggiunte come la griglia CSS, un'aggiunta completa MetaBox e ottimizzazioni di velocità aggiuntive e sia il front-end che il back-end. Le persone lo adorano perché racchiude un sacco di potenza in un'interfaccia utente relativamente ben progettata, beh, metterò anche un codice incredibilmente pulito per creare un sito Web a caricamento rapido che è ottimo per Core Web Vitals.

Le caratteristiche principali con la quarta iterazione di Oxygen Builder sono le seguenti:

Interfaccia utente nuova di zecca

C'è una crescente raccolta di plug-in di terze parti che riprogettano o reskin il costruttore di back-end di Oxygen. Il team dietro lo strumento deve aver avuto il suggerimento che la loro interfaccia utente stava diventando un po' obsoleta, quindi questa è la caratteristica principale di questa versione.

Dallo screenshot qui sopra possiamo vedere che il pannello "aggiungi elementi" è stato ricreato per mostrare più elementi in una schermata, i punti di interruzione sono stati aggiunti alla loro posizione sulla barra in alto e altre funzioni della barra in alto come l'annullamento rifare, attivare/disattivare il foglio di stile e altro ancora sono stati spostati.

Ecco cosa è stato fatto:

• Miglioramento: i valori ereditati da punti di interruzione più grandi ora vengono visualizzati nei campi del riquadro delle proprietà (#3665)

• Miglioramento: i modali ora si animano utilizzando la stessa animazione AOS con cui si animano (#3550)

• Miglioramento: ora puoi caricare schermate personalizzate per pagine di set di progettazione, blocchi e singole sezioni (#3574)

• Miglioramento: ora puoi fare doppio clic sul nome di un elemento nel riquadro delle proprietà per rinominarlo (#3547)

Un ottimo modo per mantenere la struttura del tuo sito web facile da navigare.

• Miglioramento: aggiunta indicazione visiva per indicare se un campo del riquadro delle proprietà ha uno stile tramite classe o id (#3548)

• Miglioramento: aggiunto il campo di ricerca per il riquadro dei selettori (#4037)

Se hai un sacco di classi CSS gestite in Oxygen, questo ti consentirà di trovarle più velocemente e di apportare modifiche globali al sito web.

• Miglioramento: aggiunte scorciatoie da tastiera per duplicare, salvare, eliminare, copiare, incollare (#3951)

Questo è un miglioramento incredibilmente gradito che ti consente ora di duplicare, salvare, eliminare, copiare e incollare elementi all'interno di un'istanza del builder. Anche se non hanno aggiunto un menu di scelta rapida, hanno indicato il palcoscenico e hanno aggiunto molte delle funzionalità tramite la scorciatoia da tastiera che ti aspetteresti in un menu.

Troverai altre varie modifiche all'interfaccia utente in tutto il builder, come il modo in cui vengono gestiti i margini e i padding. Ora è molto più simile a un'esperienza di strumenti di sviluppo:

Noterai anche che i colori effettivi all'interno del builder sono cambiati e ora sono molto concentrati su varie sfumature di grigio.

Nel complesso, scopriamo che la nuova interfaccia utente e ulteriori miglioramenti alla facilità d'uso rendono lo strumento un modo più efficiente e più semplice per creare siti Web della versione 3.0. Tutte queste modifiche sono molto gradite e per alcuni utenti potrebbe persino rimuovere la necessità di acquistare Hydrogen Pack (poiché ora ci sono scorciatoie da tastiera).

Correggi gli ID duplicati del ripetitore

Una soluzione incredibilmente gradita: i ripetitori non duplicano più gli ID nei singoli post visualizzati. Questo è stato uno dei maggiori problemi con 3.0 e ha causato problemi SEO e semplicemente non ha seguito le migliori pratiche.

Ecco il markup effettivo: puoi vedere che ogni ID ha un numero dopo di esso, che ti consente di applicare uno stile a celle specifiche e rimuovere ID ripetuti che non vanno bene per la SEO.

Supporto PHP8

Questa è stata una richiesta massiccia nel gruppo di Facebook e lo strumento ora supporta la versione otto di PHP. La versione 3.0 semplicemente non funzionerebbe o non caricherebbe su questa nuova versione di PHP. Ora possiamo utilizzare i miglioramenti di velocità che ciò comporta.

Ecco perché PHP 8 è fantastico:

Miglioramenti alla velocità di caricamento del costruttore

Ci sono anche alcuni miglioramenti che influiscono direttamente sulla velocità di caricamento del builder, come la rimozione del caricamento di SVG duplicati e un aggiornamento ad AngularJS 1.8.2, l'ultima versione supportata (#4031).

Leggi: Test del tempo di caricamento del backend di Oxygen Builder

Nuovo modo di archiviare i dati

In precedenza, le pagine e i modelli di Oxygen venivano archiviati nel back-end come codici brevi. Questo era ottimo per la sicurezza, ma non era il modo più efficiente per fare le cose. Con la versione 4.0, le nuove pagine vengono archiviate come JSON, che è molto più rapido ed efficiente. C'è compatibilità con le versioni precedenti con i siti creati con 3.0, quindi non c'è bisogno di preoccuparsi di eventuali modifiche sostanziali.

Dopo l'aggiornamento, se rinunci ai codici funzione, verranno convertiti nel nuovo formato JSON.

Ulteriori elementi e modifiche di WooCommerce

Questo si aggiunge alla nuova versione del core builder. Ossigeno WooCommerce 2.0. Ci sono due nuovi elementi, tra cui un mini carrello e un componente di vendita incrociata/upsell.

L'aggiunta di diverse nuove condizioni specifiche di Woo è ottima e ti consentirà di personalizzare ulteriormente il tuo sito a seconda delle situazioni specifiche dell'e-commerce.

Inoltre, se hai familiarità con i temi, ora puoi sovrascrivere i modelli WooCommerce da una cartella pre-designata invece di dover eseguire un plug-in personalizzato e reindirizzare dove Connors cerca queste sostituzioni dei modelli.

Note sull'ossigeno V4.0

Ci sono alcune cose che volevamo coprire in questo post del blog. Il primo è che le versioni alfa e beta non dovrebbero mai essere utilizzate sui siti Web di produzione perché probabilmente qualcosa si romperà. Dovresti attendere fino all'uscita della RC (o della versione candidata) o della versione effettiva 4.0. Vediamo un sacco di post su Facebook che dicono che il loro sito Web è stato danneggiato dopo l'aggiornamento alla versione 4.0, e questa è una cosa prevista se stavi usando alpha o beta.

Perché l'interfaccia utente è cambiata, così come il CSS, il che significa che le cose sembreranno interrotte se non cancelli la cache del browser e non rigeneri CSS, quindi fallo sicuramente!

L'ultima parola di cautela è che i plug-in di terze parti potrebbero rompersi a causa di questa nuova versione. Fanno le cose in modo leggermente diverso in termini di aggiunta di componenti e stili CSS, ma ci aspettiamo che la maggior parte dei principali sviluppatori di terze parti per la creazione di ossigeno avranno i loro plug-in compatibili prima dell'uscita dell'RC.

Ulteriori letture:

• Una revisione dettagliata del generatore di ossigeno (prospettiva dell'agenzia)
• Come migriamo i siti di generazione di ossigeno
• Divi Builder VS Oxygen Builder: chi vince nel 2021?

Conclusione

La quarta versione di Oxygen Builder porta con sé l'esperienza utente tanto necessaria, miglioramenti dell'interfaccia come la scorciatoia da tastiera per copiare e incollare elementi, un nuovo design più semplice, supporto PHP8 e miglioramenti di WooCommerce. Questa versione dovrebbe preparare il terreno per strumenti nativi aggiuntivi come un menu di scelta rapida e ulteriori miglioramenti della velocità del back-end.