dividesignstudio.com | risorse divi e wordpress

Come creare siti web con Divi e WordPress

j

by Divi Design Studio

}

01.07.2021

Condividi sui social 😋

Dal Blog

Post simili

Segui Divi Design Studio

Bisogno di aiuto?

Fatti sentire

Divi Design Studio Barca

Introduzione

Probabilmente sei nuovo e ti stai chiedendo molte cose del tema Divi di Elegant Themes, oppure conosci WordPress e vuoi provare un altro tema, quindi abbiamo scritto questa guida completa su come usarlo insieme al Divi Builder. Infatti il tema Divi integra anche un proprio costruttore visivo, chiamato Divi Builder, ed ecco perché dovresti creare un sito con Divi!  Quando WordPress è uscito per la prima volta, è stato piuttosto rivoluzionario. Siamo rimasti tutti assolutamente stupiti dalla velocità con cui si riusciva a creare un sito Web dall’aspetto carino e renderlo completamente funzionale in un batter d’occhio. Il tema Divi è un tema WordPress che prende questa idea e la trasforma ulteriormente. Ti consente di creare siti Web molto più complessi graficamente e avanzati in molto meno tempo. Per creare un sito web con WordPress e il tema Divi segui i seguenti passaggi:

  • Procurati un piano Hosting
  • Acquista una licenza Elegant Themes
  • Installa WordPress
  • Scarica il tema Divi
  • Carica il tema Divi nella tua installazione WP
  • Attivalo
  • Costruisci il tuo sito web con Divi Builder

Web Hosting e licenza Divi

Prima di iniziare, se sei nuovo al tema Divi e al Divi Builder, puoi dare una rapida occhiata alla pagina che spiega cos’è Divi.

L’intero tema è anche estremamente facile da usare praticamente per chiunque, e se conosci già WordPress, imparare a usare il tema Divi è estremamente veloce e semplice. Questo è ciò che lo rende un tema così meraviglioso; la sua personalizzazione, la sua facilità d’uso e la velocità con cui puoi progettare un sito davvero meraviglioso. Avrai molte opzioni, tipo quella di creare un layout da zero, prendere spunto da un modello o copiare una pagina esistente del tuo sito.

Crea Layout

Prima di approfondire come creare un sito web con il tema Divi e WorPress, vorrei consigliarti che se per qualsiasi motivo non disponi ancora di un piano hosting, registrati a SiteGround e scegli tra i loro piani. A mio parere, se il tuo business si trova in Europa, loro sono il miglior hosting per qualsiasi tipo di sito a cui stai lavorando. È una società di web hosting suggerita da wordpress.org ed è anche molto popolare nella comunità degli utenti di Divi. Tutti i piani SiteGround offrono tutto ciò di cui hai bisogno per far andare WordPress con Divi: PHP, MySQL, Apache, installazione di WordPress con 1 clic e funzionalità specifiche come ad esempio le unità SSD per accelerare al massimo il tempo di caricamento del tuo sito web.

Tutti i piani SiteGround offrono le funzionalità che ho menzionato sopra. I piani più alti Grow Big e Go Geek offrono alcune funzionalità aggiuntive premium e geek, come SuperCacher per grande velocità, supporto tecnico prioritario, Staging, ecc. Il piano Start Up più economico è l’ideale se hai bisogno di hosting per un solo sito web e se hai un budget abbastanza ridotto.

Inoltre, per utilizzare il tema Divi è necessario acquistare un abbonamento con Elegant Themes o almeno avere accesso a una chiave API. Se sei un web designer e intendi creare siti illimitati ti consiglio vivamente di approfittare dell’ abbonamento per sviluppatori a soli $89 all’anno. È meno di $7 al mese (anche se ti viene creditato una volta all’anno) e per quella somma ragionevole, ti verrà dato accesso a tutti i prodotti di Elegant Themes (incluso il tema Divi) e ai loro due plugin Premium, il plugin Monarch (per la condivisione sui social media) e il plugin Bloom (per ottimizzare gli email opt-in del tuo sito). Personalmente uso Divi da ormai 4 anni e sono contento di poter disporre di licenze illimitate in modo da creare tanti siti web per i miei clienti.

Monarch Plugin

Crea un sito con WordPress e Divi

Installa WordPress se non l’hai fatto

Innanzitutto, prima di poter iniziare a progettare il nostro sito con Divi, dobbiamo installarlo sul sito WordPress (se non hai ancora installato WordPress, segui il mio tutorial su come installarlo correttamente ). Ovviamente, se lo hai già installato sul tuo sito, puoi saltare questo passaggio, ma altrimenti, se non lo hai installato e non sai come farlo, allora vorrai sicuramente prestare attenzione.

Scarica Divi

La prima cosa che dovrai fare è scaricare il file del tema Divi dal tuo backend Elegant Themes. Non importa dove decidi di salvarlo sul tuo computer, ma assicurati di salvarlo in un posto che ti ricordi. Puoi salvarlo sul desktop, ad esempio, e poi semplicemente cancellarlo in seguito se lo desideri (oppure puoi salvarlo da qualche altra parte sul tuo computer per caricarlo nuovamente in futuro se necessario).

Installa Divi

Una volta fatto, puoi andare alla scheda “Aspetto” nella dashboard di WordPress e quindi fare clic su “Temi”. Dopo aver fatto clic su “Temi”, in alto, vedrai un pulsante che dice “Aggiungi nuovo”, quindi dovrai fare clic sulla carterlla .zip chiamata Divi.zip. Dopodiché, più o meno nella stessa pagina, vedrai un pulsante che dice “Carica tema”. Fare clic su Carica tema e quindi su “Scegli file”. Caricherai il tema quindi dal tuo computer facendo doppio clic su di esso. Una volta lì, dovrai solo fare clic su “Installa tema”. Dopodiché, il tema dovrebbe essere installato e sarai pronto per iniziare. Ti suggerisco di installare anche un tema child Divi per fare in modo che eventuali cambiamenti al codice personalizzati non vengano sovrascritti dagli aggiornamenti del tema principale.

Attiva il tema Divi o Divi child

Quindi, torna all’elenco di temi nella sottoscheda Temi (sotto Aspetto). Ora che stai guardando i tuoi temi, dovresti vedere il tuo tema Divi e anche il Divi Child. Se li hai entrambi dovrai attivare il tema child altrimenti attiva semplicemente il tema Divi principale. Dopodiché, il tema Divi dovrebbe essere attivo e sarai pronto per iniziare a costruire il tuo nuovo sito!

Usa il Divi Builder per progettare il sito

Il sito di Elegant Themes e tutti i prodotti sono disponibili solo in lingua inglese, ma non preoccuparti, il Divi Builder è stato tradotto anche in italiano come puoi vedere dagli screenshot su Divi Design Studio. Vedrai che con il Divi Builder puoi assistere a tutte le modifiche che apporti a una pagina WordPress (o un post) in tempo reale. Questo rende Divi uno strumento perfetto.

Inserisci Modulo

All’interno del generatore di pagine del tema Divi, tutto è composto da sezioni, righe e moduli. Nello screenshot hai visto che stavo provando ad aggiungere un nuovo modulo di Testo. La gerarchia viene rispettata: prima ci sono le sezioni in colore blu, poi vengono le righe in colore verde e infine i moduli in colore griio. Una sezione viene mostrara sul sito e deve contenere almeno una riga a sua volta contenente un modulo. All’interno delle righe, si inseriscono i moduli. Tieni presente che puoi anche dare un nome ai vari moduli e sezioni per renderli più facili da identificare al volo.

Divi Builder

Quindi, prima di poter fare qualsiasi altra cosa, devi iniziare con la tua prima sezione e quindi determinare, per la prima riga, quante colonne desideri e, naturalmente, quanto saranno grandi le colonne. Quando aggiungi una sezione, vedi che c’è già una riga inserita per impostazione predefinita, e ti viene chiesto di configurarla. La prima cosa che vorrai fare è fare clic su “Inserisci colonne” in modo da poter scegliere quante colonne vuoi all’interno. Una volta fatto, vedrai apparire un sacco di diverse opzioni per le colonne che desideri utilizzare.

Esistono diversi layout di colonna tra cui scegliere per ogni riga. Ad esempio, puoi avere una sezione grande o due mezze sezioni. Potresti dividerlo in quattro sezioni separate da un quarto, se lo desideri, oppure potresti rendere la sezione a sinistra di 1/3 di dimensione e a destra di 2/3 e viceversa. In realtà, è disponibile qualsiasi combinazione di metà, terzi, quarti o un’intera sezione. Quindi, scorri e fai clic sulle dimensioni delle colonne che desideri per la tua prima riga. Quindi, ad esempio, puoi fare clic sulle due colonne di mezza dimensione e poi, all’interno di quella riga, vedrai apparire due caselle rettangolari con bordi grigi che dicono “Inserisci modulo”.

Per quanto riguarda i moduli, fai clic sul pulsante di inserimento dei moduli e verrà visualizzata una finestra che mostrerà tutti i diversi moduli che è possibile aggiungere. L’elenco è molto ampio: ci sono quasi 40 moduli base da poter scegliere. Ci sono alcune cose di base che puoi aggiungere, come testo, immagini, blurb o una barra laterale, ma ci sono anche molti altri moduli “avanzati” tipo modulo dei post sul blog, un call to action, schede, contatore animato, un modulo di contatto, una testimonianza oppure la tabella dei prezzi.

Quindi, una volta che fai clic su un modulo, tutte le impostazioni per quel modulo verranno visualizzate immediatamente. Quindi, ad esempio, se clicco sul modulo immagine, verranno visualizzate impostazioni come “URL immagine / caricamento”, “testo alternativo immagine”, “URL collegamento” e “Animazione”. Non tutti i campi sono obbligatori da compilare, ad esempio, non è necessario collegare la tua immagine a un URL di destinazione se non lo desideri. Quello che mi piace di Divi è che compilare le informazioni necessarie per creare ogni modulo è molto semplice da fare. La cosa utile anche di Divi è che ogni volta che viene creato un modulo, puoi trascinarlo e rilasciarlo letteralmente su qualsiasi altra riga e ovunque tu voglia in quella riga con facilità … rendendo molto semplice lo spostamento delle sezioni nel tuo sito. Questa funzionalità è davvero ciò che rende Divi un tema top player.

Sotto ogni sezione, c’è un pulsante per inserire una nuova sezione, sotto ogni riga c’è un pulsante per inserire una nuova riga, e infine, sotto ogni singolo modulo, c’è un pulsante per inserire un nuovo modulo, rendendo le tue pagine web facili da modificare. Quindi, aggiungi semplicemente le sezioni, le schede e i moduli che desideri, dove vuoi, e poi spostali semplicemente dove vuoi, e prima che tu te ne accorga, avrai un meraviglioso sito Web che sembra essere stato creato da un costoso , azienda professionale di web design boutique.

Se vuoi qualche ispirazione su ciò che è possibile fare con Divi, puoi dare un’occhiata a questi 7 esempi di temi Divi , che ho selezionato per te.

Spero che questo sia d’aiuto e buona fortuna con la creazione del tuo primo sito web funzionale utilizzando il tema Divi!

Condividi sui social 😋

Dal Blog

Post simili

Segui Divi Design Studio

Bisogno di aiuto?

Fatti sentire

Mostra/Nascondi Commenti (0 commenti)
L

0 commenti

Invia un commento

Il tuo indirizzo email non sarà pubblicato.

Oppure scrivi un post nel nostro gruppo Facebook dedicato a Divi e WordPress. Trova risposte, condividi suggerimenti e ottieni aiuto da altri esperti di WordPress. Iscriviti ora (è gratuito)!

Rimani aggiornato

Iscriviti alla newsletter per ricevere comunicazioni e rimanere aggiornato con il blog di Divi Design Studio.

Dal blog

Rimani aggiornato con gli ultimi articoli dal blog.