Tema Avada: installazione e configurazione

Il tema WordPress più acquistato su Themeforest è Avada

Autore: Andrea Pacchiarotti
Ultimo aggiornamento: 01 Aprile 2023
Categoria: Web Marketing CMS WordPress Tema Avada

Avada è certamente uno tra i temi WordPress più apprezzati dagli sviluppatori, tant’è che è il più venduto su Themeforest: lo stesso Themeforest afferma che “Avada is the #1 selling WordPress theme on the market, with more than 525,000+ beginners, professionals, agencies, businesses, and creatives …”. Vediamo come funziona.
Avada è un tema multipurpose ovvero ha molte opzioni di personalizzazione e va bene per creare qualunque tipo di sito. Non è troppo complicato, ha un design moderno ed è compatibile con la maggior parte dei plugin.

• Installare tema Avada
• Configurare tema Avada
• Plugin per tema Avada
• Fusion Builder
• Installazione in locale tema Avada
• Conclusione

Installare tema Avada

Una volta acquistato il tema WordPress Avada su Themeforest, dovrai scaricare una cartella .zip. Scompattato il file compresso troverai una serie di file e cartelle, devi cercare Avada.zip e Avada-Child-Theme.zip all'interno della cartella  Avada Theme. Saranno questi due file compressi quelli da caricare su WordPress partendo dalla Dashboard e utilizzando il metodo consueto: Aspetto Temi Aggiungi nuovo Carica tema. Una volta installati e attivati Avada e Avada Child Theme (Aspetto Temi  Attiva), bisogna registrare il tema.
Dal pannello di WordPress, nel menu a sinistra (ma dovresti essere stato già reindirizzato nella schermata corretta), clicca Avada e segui la procedura descritta nei passaggi Register Your Website (il purchase code ti è arrivato per mail), Select A Prebuilt Website, Customize Your Website. Se hai seguito la procedura correttamente, il tema è stato registrato. La registrazione sblocca i plugin commerciali a corredo del tema e permette l’accesso a tutte le demo. Ecco una ricapitolazione schematica di quanto scritto:

Installare tema Avada su WordPress:

1. Acquista tema Avada su Themeforest
2. Scarica il file .zip e scompattalo
3. Nella cartella decompressa cerca Avada.zip e Avada-Child-Theme.zip (non scompattarli)
4. Da WordPress, tramite Aspetto > Temi > Aggiungi nuovo > Carica tema, carica i due file
5. Da Aspetto > Temi > Attiva, attiva i due file

Registrare tema Avada su WordPress:

1. Copia il Purchase Code dalla mail giunta dopo l'acquisto
2. Da WordPress, tramite Avada > Register your website, incolla il codice copiato
3. clicca Register Now

Attivazione dei plugin

Una volta registrato il tema bisogna, per il suo corretto funzionamento, installare e attivare i relativi plugin.
Vai in Avada > Plugin e installa e attiva i plugin Avada Core, Avada Builder e Yoast SEO. Gli altri plugin puoi installarli e attivarli in base alle tue necessità.
Ora bisogna configurare il sito da costruire.

Configurare tema Avada

Uno dei modi più semplici e veloci per rendere attivo e funzionante un sito web con Avada è scegliere di installare uno degli oltre 80 template predefiniti (da qui puoi farti un’idea di quante grafiche hai a disposizione una volta installato Avada). Con l'importatore Select A Prebuilt Website, che trovi sotto la voce Avada in alto a sinistra (potresti trovarlo anche altrove), l'installazione è molto rapida.
Sotto il tema Avada troverai la dicitura Theme Options che ti permetterà di configurare quasi tutti gli elementi del tema elencati di seguito:

• Layout: configura larghezza del sito e proporzione tra barra laterale e corpo principale. Inoltre permette la scelta tra layout boxed (larghezza fissa e sfondo visibile) o wide (esteso orizzontalmente)
• Responsive: configura i breakpoint, cioè le larghezze in pixel in cui il layout deve modificarsi passando da versione desktop a mobile
• Colors: consente la scelta dei colori principali del sito, anche se quelli di alcune aree particolari vanno configurati in altre sezioni
• Header: configura l’intestazione del sito come menu, logo e tutto ciò che è posizionato in alto
• Menu: configura i menu di navigazione, compresi quelli per dispositivi mobili
• Logo: serve a caricare diverse versioni del logo in modo che sia ben visibile su tutti i dispositivi, compresa la favicon
• Page Title Bar: Show bar and content permette la visualizzazione del titolo in testa a ogni pagina. Permette di configurare anche l’aspetto della barra con il titolo
• Breadcrumbs: configura le briciole di pane
• Sliding Bar: consente di aggiungere una sezione espandibile su uno dei lati della pagina
• Footer: configura il footer del sito come il copyright
• Sidebars: permette di configurare una sidebar personalizzata per ciascun tipo di pagina
• Background: configura lo sfondo del sito
• Typography: configura il font principale del sito, anche quelli provenienti da Google Fonts, oltre che dimensione del testo e interlinea
• Blog: configura l’aspetto del blog e dei post
• Portfolio: configura il portfolio
• Social media: permette di inserire i link ai profili social e di impostare colore e posizione delle icone
• Slideshows: configura gli slideshow inseribili tramite shortcode
• Elastic slider: crea slider con animazioni
• Lightbox: permette di visualizzare le immagini ingrandite
• Contact form: configura le informazioni di contatto compresa la mappa Google e l’elemento captcha per lo spam
• Search page: imposta layout e aspetto dei risultati sulla pagina di ricerca
• Privacy: imposta la normativa sulla privacy
• Extra: tra le varie cose configura l’aspetto delle immagini quando vi si scorre sopra con il mouse, il numero di post correlati da visualizzare, ecc.
• Advanced: permette di aggiungere script personalizzati, come Google Analytics, attivare le animazioni CSS, impostare i cookies secondo il GDPR, ecc.
• Performance: ottimizza le prestazioni del tema
• Custom CSS: consente di inserire fogli di stile CSS personalizzati che sovrascriveranno quelli contenuti nel file style.css
• Fusion Builder Elements: configura gli aspetti relativi alla vendita online tramite WooCommerce
• Import/Export: salva le impostazioni del tema, ma non è un backup, per quest’ultimo è consigliabile un plugin come ad esempio BackUpBuddy

Ulteriori personalizzazioni del tema Avada per WordPress sono possibili da Aspetto Personalizza.

Plugin per il tema Avada

Per far sì che Avada funzioni sono indispensabili (required) due plugin già inclusi nel pacchetto che hai acquistato: Fusion Core (ora diventato Avada Core) e Fusion Builder (ora diventato Avada Builder), li trovi nella Bacheca WordPress da Avada Plugins, servono per attivare funzionalità per la creazione guidata di pagine e post. Infatti subito dopo l’installazione dei 2 temi sarà mostrata la seguente schermata:

Basta cliccare Go Manage Plugins per ottenere quest’altra schermata:

che, tra i vari plugin, presenta i due che ci interessano; clicca il primo e installalo. Dopo averlo fatto clicca il seguente link Return to Required Plugins Installer per installare il secondo.
Nella stessa sezione trovi altri tool utili, ma non indispensabili, come ad esempio LayersSlider WP e Revolution Slider per creare slider con animazioni. Se in seguito si deciderà di installarli, basterà andare in Avada Plugins.

Fusion Builder

Quando crei una nuova pagina o post, appare il pulsante blu di Fusion Builder, cliccandolo si attiva un nuovo editor per la creazione della pagina (se non vuoi usare Fusion Builder, puoi tornare al classico editor visuale di testo WordPress, cliccando Default Editor).
Se clicchi su Container puoi scegliere quante colonne aggiungere alla nuova pagina, come da figura sottostante (è possibile scegliere tra 33 soluzioni):

Nel medesimo riquadro sono presenti anche altre due sezioni:
Library containers consente la scelta dei contenitori salvati
Special consente l’inserimento di un’interruzione di pagina; in tal modo compariranno i link per navigare tra le pagine.

Configurata la struttura della pagina e cliccando + Element, sarà possibile introdurre fino a 60 elementi come da figura sottostante:

Se pensi di usare il modello di pagina che hai creato diverse volte, è consigliabile salvarlo tramite l’icona dell’hard disk (quella prima del cestino).

Per riutilizzarli, vai su Library, scegli ciò che desideri riutilizzare e clicca Load.

Fusion Page Options
Sotto all’editor c’è la sezione Fusion Page Options (se non la vedi scorri verso l’alto della pagina, clicca Impostazioni schermata e spunta la voce Fusion Options) da dove è possibile configurare aspetti generali di pagine e post quali sfondo, header, footer, titolo, sidebar, slider personalizzati, ecc. che andranno a sovrascrivere le impostazioni a livello di tema.

Fusion Slider ed Elastic Slider
Il tema Avada include due tipi di slider:

• Fusion Slider: per slider di grandi dimensioni e con l’integrazione di video
• Elastic Slider: per slider con animazioni

Li trovi in Fusion Slider (in alto) o Elastic Slider (in basso) nella parte sinistra della Bacheca WordPress.

Installazione in locale del tema Avada

Se intendi provare il tema Avada in locale, ovvero sul tuo computer, per esempio utilizzando XAMPP, durante l’installazione del tema Avada ti troverai davanti una schermata simile a questa (nota che tra i plugin indispensabili c'è anche Contact Form 7, leggine installazione e configurazione cliccando il link)

Spuntando le caselle di controllo per importarne il relativo contenuto potresti incontrare il seguente avviso:
Il file caricato eccede la direttiva upload_max_filesize in php.ini.
Vediamo come risolverlo.
Raggiungi il file C:\xampp\php\php.ini e modifica i seguenti valori:
upload_max_filesize = 64M post_max_size = 64M memory_limit = 3000M max_execution_time = 300 max_input_time = 300
Poi vai su C:\xampp\htdocs\wordpress e aggiungi (o modifica se già la trovi) questa riga: define('WP_MEMORY_LIMIT', '3000M');

Ora chiudi e riapri WordPress e prova a ricaricare il tema.
Se ancora non funziona porta i temi Avada e Avada-Child Theme a mano (già scompattati) nella cartella C:\xampp \htdocs \wordpress \wp-content \themes (wordpress o un altro nome se la cartella l’hai nominata diversamente durante l’installazione di WordPress in XAMPP); questo è un metodo infallibile!
Vanno poi trasportati a mano, nella cartella C:\xampp \htdocs \wordpress \wp-content \plugins, i due plugin di Fusion, Core e Builder.
Successivamente si deve passare alla registrazione del tema acquistato; da Avada Registration si deve infatti inserire il token per confermare l’acquisto.
Infine da Avada Demos va installato il template scelto tra le decine disponibili: potrebbe succedere che durante l’installazione dei componenti esca un avviso che affermi l’impossibilità di caricare alcuni componenti. Niente paura, lo stesso avviso ci spiega che basta modificare un paio di parametri nel file php.ini e ci dà le informazioni su come fare.
Ovviamente i temi vanno attivati!

Conclusione

Nel sito di supporto di Avada potrai trovare documentazione, video tutorial, un forum e potrai anche loggarti per postare le tue domande.
Avada è il tema più venduto su Themeforest. Un altro tema che mi sento di consigliarti è Enfold, anche se personalmente uso molto più spesso il primo.

Se Tema Avada: installazione e configurazione ti è piaciuto, condividi l'articolo!

Ti potrebbe interessare leggere alcuni articoli di Web Marketing