Evidenziazione del plug-in Divi – Divi Switch

Divi Switch è un plug-in di terze parti per Divi che aggiunge molte nuove funzionalità a Divi che puoi attivare o disattivare con il semplice tocco di un interruttore. Molti nella comunità Divi conoscono Divi Switch poiché è in circolazione da diversi anni, ma il loro aggiornamento 3.0 ha portato molte nuove funzionalità e miglioramenti che vale la pena guardare. Alcune di queste nuove funzionalità includono: una nuova dashboard, un mini plug-in per l'importazione e l'esportazione, pre-caricatori, nuove impostazioni di personalizzazione del tema, personalizzazioni del logo, pagine 404 personalizzate e di manutenzione con layout integrati, supporto per immagini SVG e altro ancora.

In questo articolo, daremo un'occhiata al nuovo Divi Switch e presteremo molta attenzione al suo set di funzionalità aggiornato.

Installazione di Divi Switch

Carica e attiva Divi Switch come qualsiasi plugin. Viene quindi aggiunta una nuova scheda al menu Opzioni tema Divi nella dashboard chiamata Divi Switch. Inserisci la tua chiave di licenza e attiva il plugin. La scheda mostrerà quindi una nuova dashboard intuitiva.

Cruscotto Divi Switch

Divi Switch è stato ridisegnato e tutte le impostazioni sono state spostate dalla sua posizione separata nel menu di amministrazione alla pagina delle opzioni del tema Divi. Gli interruttori stessi sono distribuiti nelle sottoschede sotto la nuova scheda "Divi Switch" nelle opzioni del tema Divi.

Ogni interruttore ha un titolo, una breve descrizione e un interruttore ombreggiato impostato per impostazione predefinita su "Disabilitato". Se vuoi attivare l'effetto, fai semplicemente clic sull'interruttore e passerà a "abilitato". Diventerà blu per indicare che è attivato.

Per vedere la descrizione delle caratteristiche, seleziona il punto interrogativo che appare a destra quando passi il mouse sopra l'effetto.

Diamo un'occhiata a diverse schede e vediamo cosa può fare.

Intestazione

La scheda Intestazione aggiunge 8 opzioni e personalizzazioni. È possibile rimuovere la sottolineatura dell'intestazione, rendere cliccabile il numero di telefono, aprire i collegamenti social in una nuova scheda, centrare gli elementi dell'intestazione in alto, utilizzare un logo diverso sullo scorrimento, modificare il testo del menu dell'hamburger, utilizzare un logo specifico della pagina e sostituire il menu a schermo intero con layout Divi.

Personalizzazioni del logo

Il tema Divi ha la capacità di impostare un logo personalizzato che può essere visualizzato su ogni pagina o post. Ma cosa succede se hai bisogno di utilizzare loghi diversi sul tuo sito? Divi Switch aggiunge diverse opzioni di logo in modo da avere più loghi da visualizzare e ti dà il controllo su come e dove vengono visualizzati. Le impostazioni ti consentono di scegliere un logo diverso durante lo scorrimento e puoi impostare un logo diverso per pagine specifiche.

Logo diverso su scorrimento

Per visualizzare un nuovo logo su scroll è sufficiente caricare il logo nella schermata delle impostazioni. Il logo alternativo verrà ora visualizzato quando il visitatore scorre.

Logo specifico della pagina

Con Page Specific Logo, non sei limitato a un solo logo sul tuo sito web. Puoi avere tutti i loghi che vuoi e ti dà il controllo completo su quale logo viene visualizzato su quale pagina.

Se hai abilitato il logo specifico della pagina nelle impostazioni, viene aggiunta una nuova funzione nella parte inferiore dell'area del contenuto di pagine e post. Ora puoi impostare un logo diverso per la homepage e un altro per le altre pagine e post. Qui, devi semplicemente caricare il logo che desideri venga visualizzato su quella pagina o post.

Questo esempio mostra pagine diverse con ogni pagina che mostra una variazione sul logo del sito.

Menu a schermo intero

L'intestazione ha anche diverse personalizzazioni del menu. Per questo esempio, ho modificato il testo del menu dell'hamburger e selezionato un layout per il menu a schermo intero.

Ecco il menu dell'hamburger con il suo nuovo testo.

Facendo clic sul menu dell'hamburger si apre il menu a schermo intero e viene mostrato il layout Divi che ho selezionato. È traslucido in modo da poter vedere il sito Web in background. Include anche un pulsante di chiusura.

piè di pagina

La scheda Piè di pagina ti consente di rimuovere i punti elenco, nascondere il piè di pagina inferiore, impedire al piè di pagina di fluttuare e sostituire il piè di pagina con un layout Divi.

Questo layout è stato aggiunto al piè di pagina di ogni pagina semplicemente selezionandolo nella scheda Piè di pagina.

Contenuto principale

La scheda Contenuto principale aggiunge 11 opzioni e personalizzazioni. Puoi rimuovere la linea di divisione della barra laterale, aggiungere un preloader della homepage e impostare il tipo e i colori, modificare il rapporto dell'immagine del portfolio, impedire che le immagini si aprano in un lightbox, regolare le animazioni del dispositivo di scorrimento, rimuovere il tipo di post dei progetti, aggiungere una pagina di manutenzione personalizzata e aggiungi una pagina 404 personalizzata.

Precaricatore

Abilitando il preloader verrà visualizzata un'icona animata durante il caricamento della homepage. Questo è ottimo per indicare al visitatore che sta succedendo qualcosa mentre il contenuto effettivo della pagina si sta ancora caricando in background. Ha 15 tipi di transizione e due opzioni di colore.

Ecco un esempio di come appare il pre-loader sul sito web durante il caricamento della pagina.

Pagine 404 personalizzate e di manutenzione con layout

Queste funzionalità ti consentono di scegliere qualsiasi pagina di manutenzione e una pagina 404 dal tuo elenco di pagine. Ciò significa che puoi creare le pagine utilizzando i layout che hai creato o importato nella libreria Divi.

Per aiutarti in questo, Divi Switch include pacchetti di layout di pagina 404 premium e pagina di manutenzione con 10 layout pre-progettati che possono essere facilmente personalizzati e impostati per impostazione predefinita. Sono in formato JSON. L'immagine sopra è una delle 404 pagine.

I layout sono progettati in modo professionale, quindi la tua pagina 404 e le pagine di manutenzione non saranno solo informative ma anche attraenti. Questo esempio è una delle pagine di manutenzione. Include un timer per il conto alla rovescia.

Mobile

La scheda Mobile ti consente di impostare punti di interruzione per ogni dimensione dell'immagine. Immettere un numero del valore che si desidera modificare il punto di interruzione. Puoi anche comprimere il menu sul cellulare e mostrare un testo specifico.

Post

I post hanno una fantastica funzione di commenti. Questo sposta i commenti su un interruttore in modo che siano nascosti per impostazione predefinita.

Questo è l'interruttore chiuso. È posizionato in fondo al post, dove normalmente vengono visualizzati i commenti.

Clicca per aprire e vedere i commenti. Questo è il modulo di commento standard di WordPress.

Se aggiungi il modulo dei commenti Divi al tuo layout, puoi modellarlo con le impostazioni del modulo. È ancora posizionato all'interno dell'interruttore ed è chiuso per impostazione predefinita.

Archivi

La scheda Archivi ti dà il controllo sulle pagine dell'archivio (pagine per tag, categorie, autore, ricerca, ecc.). Aggiungi il titolo della categoria, rimuovi la barra laterale, aggiungi un link per saperne di più e aggiungi una linea di separazione sotto i post.

Ecco un esempio di pagina dell'autore con tutte le opzioni di archivio abilitate.

Integrazione

La scheda Integrazione ti consente di inserire layout Divi in ​​posizioni specifiche, incluso prima del contenuto principale, dopo il contenuto principale e prima del contenuto del post. Seleziona il layout dagli elenchi a discesa.

Ho realizzato un banner a tutta larghezza utilizzando solo un modulo di testo e l'ho inserito prima del contenuto. Naturalmente, puoi creare qualsiasi tipo di layout che desideri. Questo è un ottimo modo per creare CTA e menu speciali.

Avanzate

La scheda Avanzate consente di caricare Grafica vettoriale scalabile (SVG) per loghi, icone e altre immagini più nitidi. Poiché WordPress blocca gli SVG per impostazione predefinita, questo è un ottimo modo per utilizzare questo formato immagine con Divi.

Importa/Esporta

La scheda Importa/Esporta ti consente di esportare il codice generato da Divi Switch in un plug-in leggero e personalizzato da installare sui siti dei tuoi clienti. Ciò semplifica l'utilizzo del codice Divi Switch preferito senza dover installare e configurare il plug-in Divi Switch stesso. Inserisci un nome per il plug-in, fornisci una descrizione, aggiungi le informazioni sull'autore, assegnagli una versione del plug-in e seleziona Esporta plug-in.

Ora puoi caricare il tuo plug-in con marchio sui siti dei tuoi clienti proprio come qualsiasi plug-in. Avrà il tuo marchio.

Personalizzatore di temi

Una nuova scheda viene aggiunta al personalizzatore del tema chiamato Divi Space Settings. Qui troverai un'altra scheda chiamata Divi Switch. Il personalizzatore del tema include impostazioni aggiuntive per creare un'icona personalizzata per il menu mobile, modificare l'immagine di sfondo dell'intestazione, personalizzare il pulsante Torna all'inizio e personalizzare le pagine di archivio, il tutto con anteprima dal vivo.

In questo esempio, ho aggiunto un'immagine di sfondo all'intestazione. Puoi impostarlo per ripetere, modificare la posizione dell'immagine e modificare le dimensioni dell'immagine. Sopra questa impostazione c'è un'area di selezione in cui è possibile scegliere un'icona per il menu mobile.

In questo esempio, sto regolando il pulsante Torna in alto in modo che corrisponda al layout. Puoi regolare la dimensione dell'icona, il raggio, la posizione, il colore di sfondo, il colore dell'icona e i colori al passaggio del mouse.

In questo esempio, sto regolando il colore, l'altezza e la larghezza del separatore per le pagine di archivio. Noterai anche in questi esempi che il logo è cambiato quando ho fatto scorrere verso il basso. Ho ancora l'impostazione di scambio del logo attivata (beh, immagino che sia effettivamente "commutata").

Licenza

Divi Switch ha tre licenze tra cui scegliere:

• Sito singolo – $ 24
• 3 siti – $50
• Siti illimitati – $ 96

Divi Switch è disponibile anche nel piano di abbonamento Divi Space.

Pensieri finali

Sono impressionato dalle nuove funzionalità di Divi Switch. Non dover incollare le classi CSS e la nuova dashboard sono funzionalità benvenute. Le opzioni del logo, il pre-loader, il mini plug-in e la pagina 404 personalizzata e la pagina di manutenzione aggiungono molto a Divi da sole. Mi piace la possibilità di inserire layout Divi e scegliere un piè di pagina personalizzato. Mi piacciono anche le funzionalità di personalizzazione del tema per aggiungere un'immagine all'intestazione e personalizzarla e modificare il colore, la forma e la posizione del pulsante Torna in alto.

Divi Switch aggiunge molte funzionalità a Divi. Ho trovato ognuno di loro facile da usare. Se stai cercando molte personalizzazioni che puoi aggiungere nel modo più semplice possibile, Divi Switch potrebbe essere quello che stai cercando.

Vogliamo sentire da voi. Hai provato Divi Switch? Raccontaci la tua esperienza nei commenti qui sotto!

Immagine in primo piano tramite Oleh Donets / shutterstock.com