Uno sguardo a temi eleganti Divi 2.4

Pubblicato: 2015-06-22

divi-miniatura Divi è attualmente il tema WordPress più potente e avanzato di Elegant Themes ed è stato appena aggiornato con il più grande aggiornamento della sua storia. Divi ti offre elementi costitutivi che puoi utilizzare per creare layout e aree di contenuto interessanti. Puoi aggiungere testo, cursori, mappe, blurb, fisarmoniche, strutture dei prezzi e molto altro. Puoi creare praticamente qualsiasi tipo di sito web di cui hai bisogno. E ovviamente è reattivo.

Sono un utente Divi dal primo giorno in cui è stato rilasciato. In questo articolo condivido i miei pensieri su Divi e do un'occhiata alle novità della versione 2.4.

Novità della 2.4

Divi 2.4 è la base della futura linea di prodotti di ET. Ha oltre 1000 impostazioni di progettazione e personalizzazione del modulo e aggiunge alcune caratteristiche interessanti:

  • Impostazioni globali: è più facile apportare modifiche a livello di sito
  • Griglia fluida: il layout della pagina non ha larghezze fisse. Con la griglia fluida puoi creare le tue larghezze.
  • Impostazioni avanzate del costruttore: ogni modulo ha impostazioni CSS avanzate da una semplice interfaccia utente.
  • Libreria Divi – layout avanzati.

Opzioni del tema

Opzioni del tema

Tutti i temi ET utilizzano una schermata delle opzioni chiamata epanel. Le caratteristiche dell'epanel cambiano a seconda delle caratteristiche del tema. L'epanel di Divi è ampio. Ha le basi, come logo, favicon, barra di navigazione fissa, cattura prima immagine, stile blog, numero di post da visualizzare, ecc. Aggiunge molte opzioni che includono:

  • Pagina del negozio WooCommerce
  • Chiave MailChimp
  • Autorizzazione Weber
  • Icone dei social media
  • URL dei social media
  • Google Font
  • Scorrimento fluido: consente alla riga successiva e al suo contenuto di dissolversi durante lo scorrimento
  • Shortcode reattivi
  • Pulsante Torna in alto
  • CSS personalizzato
  • E altro ancora

Le impostazioni di navigazione includono pagine, categorie, home link, menu a discesa, ecc. Dispone di impostazioni di layout, gestione degli annunci, personalizzazione SEO, integrazione avanzata del codice e documentazione. Puoi fare molte personalizzazioni solo dall'epanel.

Personalizzazione del tema

Personalizzazione del tema

Il personalizzatore del tema funziona dal front-end e aggiunge molti dispositivi di scorrimento per regolare le dimensioni dei caratteri, gli stili, le righe, i pulsanti, i colori, le animazioni, le dimensioni dell'intestazione, il piè di pagina, l'immagine di sfondo e molto altro. Puoi apportare tutte le modifiche e vedere gli effetti man mano che si verificano (WYSIWYG – quello che vedi è quello che ottieni).

Puoi inserire le tue informazioni di contatto e i link social nell'intestazione. L'intestazione è una scelta particolarmente buona per le aziende in quanto posiziona informazioni importanti in primo piano e al centro e rimane sullo schermo quando i lettori scorrono verso il basso. Include anche layout e topografia. Proprio come le personalizzazioni standard, puoi scegliere la navigazione, i widget e una prima pagina statica.

Ti consente persino di regolare le impostazioni mobili per tablet e telefono e ognuna è indipendente da tutte le altre impostazioni e l'una dall'altra. Puoi vedere gli effetti in una schermata che simula il dispositivo mobile in modo da poter vedere come appare prima di pubblicare. Questa è una caratteristica interessante perché non è necessario ottenere un dispositivo mobile solo per controllare l'aspetto del sito con le modifiche appena apportate. Sono davvero felice di vederlo incluso.

Personalizzazione del modulo

Personalizzazione del modulo

È possibile personalizzare l'aspetto dei moduli sul front-end utilizzando il Modulo di personalizzazione. Le personalizzazioni includono cursori per dimensioni, larghezze, altezze, ecc. Puoi anche scegliere caratteri, stili, animazioni, azioni, ecc.

Biblioteca Divi

Biblioteca Divi

La Libreria Divi contiene i layout che hai creato. Puoi modificare qualsiasi layout e creare nuovi layout da questo menu.

Il Divi Builder

Il Divi Builder

La vera magia di Divi avviene quando usi The Divi Builder. Puoi usarlo selezionando il pulsante etichettato Usa The Divi Builder sopra l'editor visivo. L'edizione precedente aveva Page Builder, che funzionava solo con le pagine. Divi Builder funziona con tutti i tipi di post.

  • Divi aggiunge anche le impostazioni dei post al tuo editor in modo da poter scegliere il layout della pagina, la navigazione con i punti, nascondere il navigatore e nascondere il titolo del post su ogni post, se lo desideri.

È possibile caricare un layout di pagina o modificare il layout predefinito. Un layout è composto da sezioni con righe e colonne. I moduli vengono quindi posizionati nelle colonne. Puoi modificare il layout trascinando e rilasciando qualsiasi sezione, riga, colonna o modulo.

Sezioni

Sezioni

Le sezioni possono essere aggiunte, eliminate, clonate e modificate. Puoi modificare l'aspetto e la reazione dello sfondo, aggiungere un'immagine di sfondo, rendere lo sfondo trasparente, sceglierne il colore, riprodurre un video, scegliere le sue dimensioni complessive, se può essere messo in pausa o meno da altri giocatori, se ha un'ombra interna , se utilizza un effetto di parallasse, e imposta CSS speciale. Usando queste impostazioni puoi rendere unico lo stesso layout semplice.

Puoi anche creare un clone di ogni sezione, completo delle stesse righe, moduli, contenuto e impostazioni. Ovviamente puoi quindi modificare la nuova sezione come preferisci.

Ci sono quattro diversi tipi di sezioni. Puoi aggiungere una sezione standard, una sezione a larghezza intera, una sezione speciale o aggiungere dalla libreria.

Righe

Righe

Puoi aggiungere nuove righe e modificare quelle esistenti. Le colonne possono quindi essere posizionate sulle righe, costruendo il tuo layout.

Colonne

Colonne

Queste colonne sono dove verranno aggiunti i moduli. Sono disponibili 11 diversi layout di colonna tra cui scegliere.

Sezioni Speciali

Sezioni Speciali

Ci sono anche 9 layout di colonne speciali. Questi includono varie opzioni per le barre laterali.

Carica dalla libreria

Carica dalla libreria

Puoi caricare layout dai 32 layout predefiniti o layout da ciò che hai creato. Ognuno può essere modificato. I layout includono un numero vario di colonne, griglie, caroselli, barre laterali, home page, negozi, aziendali, portafogli, blog, modalità di manutenzione, in arrivo, landing page, pagina di vendita, case study, caratteristiche del prodotto, pagine di informazioni, pagine di contatto, pagine di acquisto e altro ancora.

Carica dalla libreria 2

La tua pagina è costruita stabilendo righe, posizionando colonne all'interno di quelle righe e quindi posizionando moduli in quelle colonne. Puoi aggiungere nuove righe, spostare le righe trascinandole o eliminarle. I layout predefiniti li hanno già realizzati per te. Ho scelto Homepage Basic e mi ha fornito un layout con uno slider, un'intestazione, quattro blurb e un invito all'azione.

Moduli

Moduli

I moduli sono tipi di contenuto speciali (come i widget). Puoi aggiungere nuovi moduli, trascinarli nell'ordine che preferisci o eliminarli. Puoi anche aggiungere vari tipi di contenuti. Puoi avere tutti i moduli che vuoi e usarli in qualsiasi combinazione tu voglia. Non sei limitato a quante volte usi lo stesso modulo. Ad esempio, se desideri uno schermo pieno di mappe, aggiungi tutti i moduli mappa che desideri.

Ci sono 40 moduli:

  • Intestazione a larghezza intera
  • Menu a tutta larghezza
  • Dispositivo di scorrimento a larghezza intera
  • Portafoglio a tutta larghezza
  • Mappa a tutta larghezza
  • Codice a tutta larghezza
  • Immagine a tutta larghezza
  • Titolo del post a tutta larghezza
  • Immagine
  • Galleria
  • video
  • Dispositivo di scorrimento video
  • Testo
  • Sfocatura
  • Schede
  • Dispositivo di scorrimento
  • Testimonianza
  • Tabella dei prezzi
  • Chiamare all'azione
  • Audio
  • Iscrizione
  • Login
  • Portafoglio
  • Portafoglio filtrabile
  • Banconi Bar
  • Contatore Cerchio
  • Contatore di numeri
  • Fisarmonica
  • Attiva/disattiva
  • Modulo di Contatto
  • Barra laterale
  • Divisore
  • Persona
  • Blog
  • Negozio
  • Conto alla rovescia
  • Carta geografica
  • Segui i social
  • Titolo del post
  • Codice

Sono sufficienti moduli sufficienti per creare layout e funzionalità interessanti per il tuo sito Web. I moduli sono uno dei punti di forza di Divi. Posizionando i moduli in colonne puoi letteralmente creare un layout che è unicamente tuo. Utilizzando i moduli, Divi ti consentirà di creare praticamente qualsiasi tipo di sito desideri.

Ogni modulo ha le proprie impostazioni. La maggior parte di loro ha un editor, impostazioni di progettazione avanzate e impostazioni CSS, quindi puoi aggiungere il loro contenuto e modificarne l'aspetto grafico. Ecco alcuni moduli e le loro caratteristiche:

Testo

Testo

Il testo offre l'editor di base e le selezioni per il colore e l'orientamento del testo, le impostazioni di progettazione avanzate (cursori per larghezze, altezze, colori, margini, ecc.) e CSS personalizzato. La maggior parte dei moduli include queste o caratteristiche simili.

Sfocatura

Sfocatura

Ho fatto clic su Blurb per vedere che tipo di contenuto potevo aggiungere. Qui posso assegnargli un titolo, un URL, determinare come funziona l'URL, assegnargli un'icona, scegliere colori, caratteri, ext. e quindi aggiungere contenuto utilizzando l'editor TinyMCE standard. Le impostazioni di progettazione avanzate includono le stesse impostazioni del modulo di testo ma con un'impostazione dell'immagine aggiunta.

Carta geografica

Carta geografica

Map ti offre una bella mappa che puoi visualizzare come mappa normale (con o senza terreno) o vederla in vista satellitare (con o senza etichette). Puoi aggiungere puntine in modo da poter evidenziare posizioni specifiche sulla mappa. Basta digitare l'indirizzo e selezionare per aggiungere un nuovo pin. Le impostazioni avanzate offrono un filtro in scala di grigi con controlli percentuali.

Blog

Blog

Interessante il modulo Blog. Ti consente di posizionare i post del blog all'interno di una singola colonna di qualsiasi larghezza a tua scelta. Il motivo per cui mi piace è che puoi avere una prima pagina statica e continuare a visualizzare i post del tuo blog da categorie specifiche che scegli. Puoi mostrarne quanti ne vuoi e puoi mostrare un estratto, il nome dell'autore, la data, le categorie, l'impaginazione, l'immagine in primo piano, il pulsante Leggi altro e altro ancora. Questo renderebbe un interessante layout in stile rivista. Include le stesse impostazioni di progettazione avanzate del modulo di testo ma con alcune impostazioni extra per i colori di sfondo e le intestazioni.

Titolo del post

Titolo del post

Questo è uno dei nuovi moduli. Ti consente di progettare l'aspetto del titolo del post e scegliere cosa è incluso e cosa no. Le funzionalità di progettazione avanzate sono per lo più le stesse del modulo di testo con alcune impostazioni extra come il colore di sfondo.

Titolo del post 2

Ecco uno sguardo alle impostazioni di progettazione avanzate per il modulo del titolo del post.

Utilizzo di Divi come tema regolare

Utilizzo di Divi come tema regolare

Ovviamente non è necessario utilizzare nessuna di queste funzionalità. Puoi semplicemente usare Divi come faresti con qualsiasi altro tema. Scegli semplicemente l'impostazione che desideri nell'epanel e crea contenuti come al solito, utilizzando l'editor standard. Questo rende un sito Web o un blog semplice e pulito che è abbastanza elegante da poter essere utilizzato così com'è.

Supporto linguistico

Supporto linguistico

Divi ha il supporto integrato per oltre 30 lingue e può essere tradotto in altre. Ciò include il front-end e il builder, che viene visualizzato anche da destra a sinistra quando è abilitata una lingua RTL.

Ottenere Divi

Ottenere Divi

Divi fa parte del piano personale di ET che costa $ 69 all'anno e include l'accesso a tutti i temi, aggiornamenti perpetui, supporto e utilizzo illimitato. Se annulli l'abbonamento, manterrai tutto ciò che hai scaricato da ET.

Divi da solo vale quel prezzo secondo me (soprattutto se si considera che la maggior parte dei temi di questo calibro costano molto di più), ma se si considera che include 87 temi e il conteggio, unirsi a Elegant Themes per almeno un anno è un no- cervellone.

Più in fondo alla strada

Le prossime versioni all'ordine del giorno di ET sono il plug-in Divi Builder, un tema di rivista chiamato Extra che condividerà gli stessi elementi di costruzione ma con un focus sul layout della rivista, e quindi Divi 3.0. È chiaro che ET è pienamente impegnata nel successo di Divi e della piattaforma di creazione Divi. Ora che ho visto Divi 2.4 non riesco a immaginare i miglioramenti e le funzionalità di Divi 3.0.

Plugin Divi Builder

Uno svantaggio di Divi è che una volta creato un layout di pagina non puoi cambiare tema senza ricreare le pagine e i post. ET ha risolto questo problema con un plug-in gratuito che mantiene il layout indipendentemente dal tema che stai utilizzando. Puoi mantenere tutti i tuoi layout e moduli anche se non usi un tema da ET. Questo plugin dovrebbe essere disponibile a breve.

Pensieri finali

Divi può creare layout complessi ma è comunque facile da usare. Non ha una grande curva di apprendimento. Puoi facilmente aggiungere elementi e trascinarli ovunque tu voglia per creare i tuoi layout personalizzati e modificarne l'aspetto con i cursori. Possono essere complessi o semplici come vuoi che siano.

Potrebbe volerci del tempo per ottenere il layout nel modo desiderato, ma almeno puoi salvare i layout come modelli o utilizzare layout predefiniti che possono farti risparmiare molto tempo di sviluppo. È più facile che mai effettuare regolazioni di stile avanzato e ogni impostazione ha un pulsante Annulla, quindi non devi preoccuparti di commettere errori. I siti realizzati con Divi sembrano impressionanti su qualsiasi dispositivo e si caricano velocemente. Consiglio vivamente Divi 2.4 di Elegant Themes.

Scopri di più su Divi e scaricalo qui

E tu? Hai provato Divi? La tua esperienza è stata simile alla mia? Hai qualcosa da aggiungere? Raccontacelo nei commenti qui sotto.