Caratteristiche principali del prodotto Divi: DiviCity

Pubblicato: 2023-05-08

DiviCity è un layout Divi di una pagina disponibile nel Divi Marketplace. Ha un design versatile che può essere utilizzato per molti diversi tipi di siti Web ed è completamente reattivo e personalizzabile. In questo punto saliente del prodotto, daremo un'occhiata al layout DiviCity e ti aiuteremo a decidere se è il layout giusto per te.

Iniziamo!

Sommario
  • 1 Installazione di DiviCity
  • 2 DiviCity
    • 2.1 Sezione Intestazione DiviCity
    • 2.2 Sezione Informazioni su DiviCity
    • 2.3 Sezione blog DiviCity
    • 2.4 Sezione Numeri DiviCity
    • 2.5 Sezione DiviCity Cosa fare
    • 2.6 Sezione DiviCity dove farlo
    • 2.7 Sezione Visitaci DiviCity
    • 2.8 Sezione Contatto DiviCity
    • 2.9 Layout DiviCity Mobile
  • 3 Acquista DiviCity
  • 4 Considerazioni finali

Installazione di DiviCity

DiviCity si presenta come un file ZIP contenente file Divi Visual Builder .json. Per installare il layout, inizia decomprimendo il file. Successivamente, apri la tua pagina in Divi Builder.

Fai clic sull'opzione di portabilità nella parte inferiore della pagina e seleziona la scheda di importazione. Quindi seleziona il file .json per il layout DiviCity e inizia a importare il layout. Una volta che il layout è stato importato, tutto ciò che devi fare è sostituire il contenuto con il tuo e il tuo sito web è completo!

Caratteristiche principali del prodotto Divi: installazione DiviCity

DiviCity

DiviCity consiste in un layout Divi Builder di una pagina. Viene fornito senza nessuna delle immagini demo, quindi ho aggiunto la mia ai fini di questo articolo. Diamo un'occhiata alle sezioni fornite con questo layout!

Sezione intestazione DiviCity

L'intestazione consiste in una grande immagine con un divisore angolato nella parte inferiore. L'intestazione ha caratteristiche di sottotitolo e testo dell'intestazione, oltre a un pulsante. Il testo presenta un effetto di animazione di caricamento. Due riquadri si sovrappongono alla parte inferiore della sezione dell'intestazione. Ogni riquadro contiene del testo di intestazione, una linea di divisione, il corpo del testo e un pulsante. Queste caselle hanno anche un'animazione di caricamento e si espandono al passaggio del mouse. Infine, ci sono quattro moduli blurb sottostanti con un'icona, il testo dell'intestazione e il testo del corpo. I moduli blurb vengono rivelati uno alla volta mentre la pagina viene caricata. Questo layout di intestazione può essere facilmente personalizzato con le tue foto e i tuoi contenuti per creare una sezione di intestazione accattivante e coinvolgente che fornisca ai tuoi visitatori informazioni chiave sulla tua attività a colpo d'occhio.

Evidenziazione del prodotto Divi Intestazione DiviCity

DiviCity Informazioni sulla sezione

La sezione about ha un testo introduttivo, un'intestazione a sinistra e un'immagine a destra. Entrambi questi elementi hanno un'animazione in dissolvenza e si spostano al centro. Di seguito sono riportate tre sezioni a larghezza intera che presentano un'immagine e un blocco di testo con un'intestazione e del testo del corpo. Ognuna di queste sezioni ha anche un effetto di animazione di caricamento.

Caratteristiche principali del prodotto Divi: Informazioni su DiviCity

Sezione blog DiviCity

Per impostazione predefinita, la sezione del blog presenta un semplice modulo dei post recenti che elenca tre post recenti con l'immagine in primo piano e le informazioni sul post. In questa sezione sono presenti anche testo di intestazione e testo del corpo. Questa sezione presenta un'animazione in dissolvenza.

Evidenziazione del prodotto Divi: blog DiviCity

In alternativa, puoi ottenere il design presentato nella demo del layout installando il plug-in gratuito Divi Article Cards. Una volta installato e attivato il plug-in sul tuo sito, apri le impostazioni di Divi 100 dal menu della dashboard di WordPress. Attiva la scheda articolo, quindi fai clic su salva.

Evidenziazione del prodotto Divi: Impostazione scheda articolo DiviCity

Ora i moduli del blog sulla pagina DiviCity dovrebbero assomigliare al layout sopra.

Evidenziazione del prodotto Divi: DiviCity Blog 2

Sezione Numeri DiviCity

La sezione dei numeri presenta quattro contatori a barre su uno sfondo dell'immagine: i contatori numerici si caricano al caricamento della pagina.

Caratteristiche principali del prodotto Divi: i numeri DiviCity

Sezione DiviCity Cosa fare

Questa sezione presenta un'intestazione e parte del testo del corpo. Ci sono due sottosezioni sotto questa, ciascuna con un'immagine, un'intestazione e un corpo del testo. Questa sezione è un layout molto versatile che può essere utilizzato per dimostrare funzionalità, servizi o altri aspetti della tua attività.

Evidenziazione del prodotto Divi: DiviCity cosa fare

DiviCity Sezione Dove farlo

Questa sezione è anche versatile e presenta un'intestazione, corpo del testo e tre blurb con un'immagine, del testo, un breve testo descrittivo e un bordo che appare al passaggio del mouse. L'immagine si ingrandisce anche al passaggio del mouse. Puoi utilizzare questi blurb per collegarti a un'altra pagina o sezione del tuo sito Web o semplicemente per visualizzare alcune funzionalità o informazioni.

Evidenziazione del prodotto Divi: DiviCity Dove farlo

Sezione DiviCity Visitaci

Successivamente, la sezione Visitaci presenta sei moduli blurb, ciascuno con un'icona, un testo di intestazione e un testo del corpo. Puoi personalizzare questa sezione per evidenziare più funzioni o aspetti dei tuoi servizi o per suddividere il testo denso con intestazioni e icone separate. I moduli blurb presentano tutti un'animazione di ingrandimento.

Evidenziazione del prodotto Divi: DiviCity Visitaci

Sezione contatti DiviCity

Infine, la sezione dei contatti inizia con una striscia arancione con tre icone dei social media. Di seguito è riportata la sezione del modulo di contatto con un testo di intestazione grande a sinistra e il modulo a destra. La sezione dei contatti ha uno sfondo con un'immagine di grandi dimensioni con una sovrapposizione scura. Questa sezione presenta anche un effetto di animazione a ribaltamento e le icone dei social media si dissolvono.

Evidenziazione del prodotto Divi: Contatto DiviCity

Layout mobile DiviCity

DiviCity è completamente compatibile con tablet e dispositivi mobili. Diamo un'occhiata alla versione mobile di alcune sezioni.

La prima è la sezione dell'intestazione, con un'immagine di sfondo di grandi dimensioni, testo dell'intestazione e pulsante. La prima casella di testo si sovrappone all'intestazione e il resto del contenuto della sezione dell'intestazione segue di seguito.

Caratteristiche principali del prodotto Divi: DiviCity Mobile Header

Questo fa parte della sezione mobile about con immagini separate da alcune sezioni con testo.

Caratteristiche principali del prodotto Divi: DiviCity Mobile Informazioni

Questa è la versione mobile della sezione "Dove farlo". Ha una grande immagine in alto, il testo dell'intestazione, il corpo del testo, quindi tre immagini con un'etichetta su ciascuna.

Evidenziazione del prodotto Divi: DiviCity Mobile Dove farlo

E infine, questo è il piè di pagina mobile. Come la versione desktop, presenta una barra arancione con le icone dei social media, seguita dalla sezione del piè di pagina con un'immagine di sfondo, testo e modulo di contatto.

Evidenziazione del prodotto Divi: contatto mobile DiviCity

Acquista DiviCity

DiviCity è disponibile nel Divi Marketplace. Costa $ 19 per l'utilizzo illimitato del sito Web e gli aggiornamenti a vita. Il prezzo include anche una garanzia di rimborso di 30 giorni.

Recensione DiviCity

Pensieri finali

DiviCity è un layout di sito Web semplice e di bell'aspetto che è incredibilmente versatile. Poiché è costruito con Divi, il layout è facile e intuitivo da personalizzare per il tuo uso. Le animazioni di caricamento e gli effetti al passaggio del mouse in tutto il layout sembrano piacevoli e coerenti e non distraggono troppo dal contenuto della pagina o dall'usabilità. Mi piace anche l'uso di immagini di grandi dimensioni nel design e la tipografia utilizzata nel layout. Se stai cercando un semplice layout di un sito Web di una pagina per il tuo prossimo progetto Divi, questo potrebbe essere il prodotto giusto per te.

Ci piacerebbe avere tue notizie! Hai provato Divicity? Fateci sapere cosa ne pensate nei commenti!