Come installare e configurare il tema Avada su WordPress

Con oltre 400.000 vendite, Avada risulta essere il tema più venduto per WordPress. Complimenti agli sviluppatori!

Tra i pregi del tema: la compatibilità con i plugin più utilizzati (WooCommerce, SEO by Yoast, Easy Digital Download, bbPress, Contact Form 7 e moltissimi altri), la corposa documentazione, le numerose demo, gli strumenti messi a disposizione per la creazione di pagine visualmente attraenti.

In questa guida vedremo come installare il tema sul proprio sito WordPress.

Operazioni preliminari: acquisto del tema Avada e download dei file

Acquistato il tema Avada su Theme Forest, si avrà la possibilità di scaricare 2 pacchetti di file: uno che contiene il pacchetto con tutti i file del tema (documentazione, psd, ecc.) e uno che contiene solo il tema.

La prima volta che si deve installare Avada sul proprio progetto WordPress conviene scaricare il pacchetto completo, il file themeforest-2833226-avada-responsive-multipurpose-theme.zip (di oltre 250 MB) e scompattarlo.

Si otterranno così diverse cartelle: Avada Theme, Extras, Languages, Licensing, PS. Tra queste la più importante è la prima, Avada Theme, che al suo interno contiene i 2 zip del tema: Avada.zip e il relativo tema child Avada-Child-Theme.zip.

Installazione del tema Avada su WordPress

Come per ogni tema di WordPress, è possibile installare il tema in 2 modi: direttamente dal pannello di amministrazione di WordPress oppure via FTP.

Installazione del tema Avada dal pannello di amministrazione di WordPress

Per installare il tema base Avada direttamente da WordPress:

Aspetto > Temi > Aggiungi nuovo > Carica tema > Scegli file > selezionare il file Avada.zip e caricarlo

Successivamente caricare anche il file Avada-Child-Theme.zip

Questi file si trovano all’interno del pacchetto scaricato da Themeforest, in Avada_Full_Package\Avada Theme.

Avada.zip è grande circa 5MB, per cui il caricamento di questo file via pannello impiegherà un po’ di tempo (qualche minuto).

Installazione del tema Avada via FTP

Per installare il tema Avada tramite un client FTP:

scompattare i file Avada.zip e Avada-Child-Theme.zip

copiare le relative cartelle in wp-content > themes, assicurandosi che i nomi delle cartelle caricate siano Avada e Avada-Child-Theme.

La cartella Avada è di 14.6MB.

Attivazione del tema Avada

Una volta installato il tema con uno dei due metodi visti sopra, naturalmente deve essere attivato da pannello di amministrazione:

Aspetto > Temi > click sul pulsante Attiva in Avada Child.

Operazioni conclusive: registrazione del tema, attivazione dei plugin e verifica del sistema

A questo punto il tema Avada risulta installato sul proprio sito, ma è comunque necessario svolgere alcune operazioni per completare l’installazione.

Registrazione del tema Avada

Innanzitutto occorre inoltre registrare il tema, cliccando sul tab Registration e inserendo il codice di registrazione (token) creato seguendo le istruzioni sotto alla casella dove va inserito il codice. Al nome del token conviene dare il nome del progetto che stiamo realizzando: in questo modo se si acquista il tema Avada per più progetti, visitando la pagina di Avada si otterrà l’elenco di tutte le proprie installazioni.

La registrazione ha due funzioni principali:

  • sblocca i plugin commerciali a corredo del tema,
  • dà l’accesso a tutte le demo del tema.

Attivazione dei plugin commerciali compresi nel tema Avada

Eseguita la registrazione è necessario cliccare il tasto Manage Plugins Below per attivare i plugin commerciali compresi nel tema, in particolare Fusion Core e Fusion Builder, essenziali per il funzionamento di Avada.

Verifica dei requisiti del server web

L’ultimo passaggio prevede la verifica delle impostazioni del server per fare in modo che il tema Avada funzioni al meglio.

Cliccare sul tab System Status e verificare che le impostazioni siamo tutte sul verde, altrimenti è oppportuno intervenire nelle impostazioni del server, per esempio cambiando la versione del PHP, installando componenti mancanti, aumentando alcune impostazioni del PHP (max input vars, time limit…).

Prime configurazioni del tema Avada

Molte caratteristiche del tema si gestiscono da Avada > Theme Options.

Le principali sono:

  • il layout
  • il menu
  • i colori
  • l’header
  • il footer
  • l’aspetto del testo (typography)

e molte altre configurazioni ancora.

Custom Post Type in Avada

Seguire questa guida di 10for2.com (in inglese).

Versione stampabile in Avada

Non esiste nel tema Avada un settaggio per configurare questo aspetto.

Si può agire con questo workaround.

1. Aggiungere la classe no-print nel foglio di stile di Avada

Da Avada > Theme Options > Custom CSS, aggiungere:

/* VERSIONE STAMPABILE DOCUMENTI */
/* classe per non visualizzare contenuti su versione stampabile */
@media print
{ .no-print, .no-print *
{ display: none !important; }
}

2. Aggiungere la classe no-print sui div dei diversi template che compongono la pagina

Si individua il template da modificare nella cartella /public_html/wp-content/themes/Avada/templates, per esempio footer-content.php.

Si copia il file nel tema child, anche lì nella cartella templates (quindi in /public_html/wp-content/themes/Avada-Child-Theme/templates).

Infine si edita il template, aggiungendo la classe no-print all’elemento div che non si intende visualizzare nella versione stampabile.

3. Utilizzare la media query print per eliminare gli altri elementi non presenti nei template e ottimizzare la visualizzazione

Per esempio per eliminare gli elementi privacy, back to top e re-captcha, uso il codice:

@media print
/* non mostra recaptcha, privacy, slidingbar */
{ .rc-anchor, .grecaptcha-badge, .slidingbar-area
{ display: none !important; }
}

Per ottimizzare il layout della versione stampabile invece uso:

/* altre personalizzazioni */
@media print
/* allinea contenunto del documento a sx */
{ .campi-documento
{ margin-left: -200px; }
/* toglie bordo sotto titolo */
.fusion-page-title-bar
{ border: 0; padding:0; }
/* avvicina contenuto a titolo pagina */
#main
{ padding: 0; }
}

Riferimenti utili

Documentazione ufficiale del tema Avada

Demo e funzioni del tema Avada

Hai trovato utile l’articolo? Commenta sotto o condividilo!

11 commenti
  1. Alessandra Vaccaro
    Alessandra Vaccaro dice:

    Buonasera Marco,

    ho appena acquistato il tema avada, ma quando vado ad installarlo mi da questo errore e non va più avanti.

    Impossibile creare la directory. Avada/includes/lib/inc/redux/extensions/vendorsupport/vendor_support/vendor/ace_editor/snippets

    Come posso risolvere?
    Grazie

    Rispondi
  2. Vincenzo
    Vincenzo dice:

    Buongiorno,
    Appena provo ad installare il plugin: Fusion Core, mi da questo errore:
    “Fusion Core installation failed. The update procedure could not delete the plugin due to a permissions issue on your server. Please ask your hosting provider to check the permissions level or manually remove the plugin via FTP or WordPress before attempting to reinstall it.”
    Come posso risolvere ?
    Grazie

    Rispondi
    • Marco Raimondi
      Marco Raimondi dice:

      Ciao Vincenzo.
      Io accederei via FTP dentro la cartella wp-content/plugins, rimuoverei la cartella di Fusion Core e proverei a ricaricarla sul server per vedere cosa succede. Se te la carica dovresti essere a posto, altrimenti dovrebbe essere un problema di permessi della cartella.
      Fusion Core è indispensabile per Avada, altrimenti non funziona nulla.
      Fammi sapere se e come hai risolto.

      Rispondi
  3. Franco Tossini
    Franco Tossini dice:

    Ciao Marco, ho appena acquistato Avada e al termine della installazione da wordpress mi da il seguente messaggio:”Il file caricato non può essere spostato in wp-content/uploads/2019/04″ qual’è il problema? Grazie

    Rispondi
    • Marco Raimondi
      Marco Raimondi dice:

      Ciao Franco e grazie di aver fatto la tua domanda sul mio blog.
      Quello che segnali dovrebbe essere un problema legato ai permessi delle cartelle presenti sullo spazio disco su cui stai installando il tema.
      Prova a fare accesso allo spazio via FTP, cancellare la cartella del tema e a caricarcela su via FTP (non utilizzando cioè la dashboard di WordPress).
      Terminato l’upload, vai sul pannello di amministrazione di WordPress, clicca sulla voce Aspetto e verifica che il tema caricato sullo spazio disco sia presente. A quel punto puoi attivarlo e iniziare a lavorarci.

      Rispondi
  4. leila fatnassi
    leila fatnassi dice:

    Ciao Marco,
    sono in completa confusione. son settimane che cerco di installare avada su wordpress ma non riesco.
    purtroppo sulla mia pagina non viene visualizzata la dicitura aggiungi tema ma cerca tema e se cerco avada non lo trova.

    Rispondi
    • Marco Raimondi
      Marco Raimondi dice:

      Ciao Leila e grazie per aver scritto sul mio blog.
      Prova così:
      Una volta scaricato lo zip del tema Avada dal sito Themeforest, scompatta il file. Tra i vari documenti , ce ne dovrebbe essere uno che si chiama AvadaTheme.zip.
      Scompatta pure quello e carica la cartella ottenuta nella directory dei temi del tuo sito wp-content/themes via FTP.
      A questo punto, se accedi alla pagina dei temi dal pannello di amministrazione di WordPress, dovresti vedere anche Avada e poterlo attivare.
      Un’ultima nota: carica anche il chilo e lavora su quello 🙂
      Fammi sapere se hai risolto

      Rispondi
  5. Gian Paolo Panara
    Gian Paolo Panara dice:

    Ciao Marco, ho installato i 2 pacchetti Avada.zip e Avada-Child-Theme.zip in locale per sviluppare il sito prima di andare online ma quando provo ad attivare il tema child l’attivazione non va buon fine e anzi mi riporta alla pagine di errore connessione:

    Impossibile raggiungere il sito. La connessione è stata reimpostata.
    Prova a:

    Verificare la connessione
    Controllare il proxy e firewall
    Eseguire lo strumento Diagnostica di rete Windows
    ERR_CONNECTION_RESET

    Hai idea del perchè? grazie

    Rispondi

Lascia un Commento

Vuoi partecipare alla discussione?
Fornisci il tuo contributo!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *