Genesis Framework di StudioPress: la grande guida

In questo articolo vedremo assieme il Genesis Framework di StudioPress.

Anche se sei un blogger alle prime armi è facile che tu ne abbia già sentito parlare: Genesis framework è infatti uno dei sistemi per lo sviluppo di temi grafici per WordPress più diffuso al mondo (e per buone ragioni che vedremo). In pratica gli sviluppatori di temi lo usano per creare template professionali che puoi usare per costruire il tuo blog o i tuoi siti.

Obiettivo del post è farti capire non solo cosa siano il Framework Genesis e i vari Child Theme, ma soprattutto perché dovresti usarli per i tuoi progetti web, in particolare per il tuo blog.

Prima di cominciare a parlare di Genesis

Questo articolo è molto corposo. L’idea è quella di creare un punto di riferimento per chiunque voglia capirne di più sul Genesis Framework e in generale sul lavoro e i child theme creati da StudioPress o da terze parti. Per questo motivo ti invito a creare un bookmark per questa pagina, in modo che tu possa trovarla quando serve.

Per poterti muovere agilmente tra le sezioni ho creato questa sorta di indice. Utilizzalo come preferisci per approfondire i diversi argomenti.

Parte 1. Cosa sono i framework per WordPress e in cosa Genesis differisce dagli altri.

Parte 2. Tutti i vantaggi fondamentali di Genesis.

Parte 3. Child Theme e Widget: la caratteristica di Genesis.

Credo sia tutto quanto necessario per avere un bell’approfondimento sui reali vantaggi che potresti avere utilizzando il Genesis Framework di Studiopress. Grazie mille per il tuo tempo e la tua attenzione, spero di sentirti nei commenti e – se ti va – scrivimi attraverso il form dei contatti. Rispondo sempre a tutti.

[Parte 1] Cosa sono i Framework per WordPress e perché Genesis vince

Generalmente un sito costruito in WordPress è composto dal binomio WordPress, che è il CMS (Content Management System, ovvero sistema di gestione dei contenuti) e tema grafico, che in pratica serve a “modellare” le strutture del CMS modellando i dettagli grafici quali bordi, font, colori, spazi etc.

In alcuni casi, i produttori di temi grafici hanno preferito creare uno strato intermedio, chiamato Framework, dove hanno concentrato tutta la parte funzionale del tema.  Questo per dare la possibilità agli sviluppatori di creare in modo più rapido e veloce il vero e proprio tema grafico, che diventa quindi un “child theme” del principale.

Per capirci avremo una struttura a tre livelli:

1. WordPress (Il motore del tuo progetto)
2. Genesis Framework (Struttura portante: telaio, ammortizzatori, elettronica, etc)
3. Tema grafico (Child Theme), ovviamente compatibile con Genesis (Carrozzeria in fibra super leggera, appoggiata sul telaio e dal design unico)

Temi grafici estremamente leggeri, velocità di caricamento e in generale una maggiore semplicità di aggiornamento sono solo alcuni dei vantaggi derivati da questo approccio (li vedremo tutti in seguito).

Certo, è necessario che il tema padre sia davvero solido e ben progettato per poter essere usato come base, e guarda caso Genesis è considerato – dai più esperti guru di WordPress e dai produttori stessi, il framework più sicuro e stabile esistente oggi nel panorama di WordPress.

Da cosa dipende questa fama? Andiamolo a scoprire

Alcune considerazioni sui blog e sulla scelta dei temi grafici per WordPress

Ormai conosco tantissime persone che sviluppano siti e blog con WordPress. Spesso mi rivolgono domande tipo: “Meglio Genesis o meglio Themeforest? Perché dovrei usare Genesis che tanto su Themeforest ho tutto? A me sembra che il Genesis Framework sia così scarno…”. Più che domande sembrano quasi affermazioni dispregiative, e – di solito – chi disprezza compra. Di sicuro dimostra di non conoscere tanto Genesis.

Quando devi scegliere il tema per un blog, ci sono considerazioni che dovresti fare. Su che provider farlo, come farlo, con che strumenti e che prodotti sono le prime – e lecite – domande, ma prima di fare la scelta, ti invito a riflettere su qualche altro elemento.

Qual è la prima cosa che serve al tuo blog?

Contenuti che piacciano ai tuoi lettori, che possano fornire loro le risposte che cercano. E quando hai bisogno di una risposta, non ti concentri su un dettaglio grafico, ma su tutta l’esperienza d’uso. Non vuoi pensare a cosa devi fare, non vuoi faticare per trovarla o scovarla tra i meandri di menu troppo fantasiosi o di strutture di navigazione inutilmente complesse.

Vuoi esattamente ciò che ti serve, e lo vuoi subito, in modo rapido, fruibile, immediato.

Quando decidi come creare il tuo blog, non pensare a te stesso, pensa ai tuoi lettori, pensa a come si muoveranno, pensa a cosa tu stesso vorresti ogni volta che navighi su un sito.

• Non cerchi forse velocità nel caricamento delle pagine?
• E non pretendi un’ottima leggibilità?
• Non desideri forse sistemi di condivisione ben fatti e ricchi di funzionalità?
• Non ti piacerebbe un sistema di commenti e di interazione immediato e funzionale?
• Non vorresti forse avere la possibilità iscriverti alla newsletter in modo sicuro e magari in cambio di regali?

Ora queste cose potrebbero essere tutte nel tema grafico. Tuttavia, pur essendo incluse, potrebbero non essere esattamente “giuste” per te. Quindi molto spesso avere un tema grafico con 100 funzionalità si traduce ad averne 70 non utilizzate.

E sai cosa fanno le funzionalità non utilizzate? Rimangono lì: non si vedono, non si usano e non servono a nessuno. È un male? Sì, assolutamente sì. Le funzionalità inutilizzate pesano inutilmente sul tuo progetto e possono essere fonte comunque di malfunzionamenti e problemi di sicurezza.

Ecco perché preferisco l’approccio contrario che caratterizza il Genesis Framework: dammi una sola cosa, fatta bene. Poi alle funzionalità aggiuntive ci penso io, andando ad aggiungere il singolo plugin, specializzato e ottimizzato soltanto per ciò che mi serve. La soluzione migliore, più leggera, più sicura perché specializzata.

I benefici dell’essenzialità del Genesis Framework di Studiopress

Quando ho iniziato a capire cosa fosse necessario nel mio business basato su blog, ho iniziato a riflettere meglio sulle implicazioni di tutti gli attori coinvolti: Wordpress, Tema grafico, Plugin.

Quando ho capito che qualsiasi elemento inutile crea confusione e distrazione, ho iniziato a pensare in modo essenziale.

Titoli, categorie, tag, immagini, tutto deve essere al posto giusto, ci deve essere spazio per respirare e solo le informazioni necessarie. Quasi sempre è un discorso a togliere, piuttosto che aggiungere.

Hai un progetto a lungo termine? (Un blog lo è quasi sempre) La confusione e il “cluttering” (ovvero l’ingombro dovuto ai troppi elementi) servono solo a distrarre e allontanare i tuoi lettori. È una consapevolezza che una volta raggiunta ti porterà a farti un paio di domande:

1. Ti serve veramente un tema grafico super sofisticato?
2. Ti servono veramente i millemila plugin che tutti dicono di usare (e di cui sembrano poter garantire gli incredibili risultati?) Oppure il massimo sarebbe avere un bel design, chiaro, essenziale, capace di guidare il lettore senza farlo pensare (Conosci il paradigma Don’t Make Me Think di Steve Krug?) e al tempo stesso in grado di mostrargli tutte le risposte di cui ha bisogno?

Da un punto di vista del lettore, non possono esserci dubbi sulla risposta.

E questo non significa avere un blog brutto, non è certo questo che sto dicendo. Tutt’altro, significa avere un blog dove il design e la grafica sembrano scomparire per far spazio al protagonista assoluto di ogni progetto: il contenuto.

E per quanto mi riguarda, ogni design creato con il Genesis Framework di Studiopress viaggia proprio in questa direzione. Vediamone un paio giusto per stuzzicare l’appetito.

Nella foto sopra spicca Digital Pro Theme, perfetto per quasi ogni tipo di blog. Lo stanno usando in tantissimi, e per un motivo: una heroes image a tutta pagina che ti permette di evidenziare immediatamente il tuo messaggio principale, un paio di sezioni per spingere i tuoi prodotti e gli ultimi articoli pubblicati. Cosa pretendere di più da un blog? Guardalo nella demo del sito, ne vale la pena.

Sei un autore o uno scrittore? Eccoti allora Author Pro e dimmi se non è magnifico per la promozione di libri e pubblicazioni.

E ce ne sono decine di altri, più tutti quelli di terze parti. Spero di avere stimolato il tuo appetito. Ti ricordo che tutti i temi grafici li trovi sul sito di StudioPress che ti invito a visitare. Intanto siamo arrivati alla fine della prima parte.

[Parte 2] Genesis Framework: i vantaggi fondamentali

Il Genesis Framework di StudioPress offre una serie di vantaggi unici per chi lo utilizza. Tra i tanti, che vedremo elencati tutti alla fine di questa seconda parte dell’articolo, ve ne sono 2 fondamentali: indicizzazione SEO e velocità. Cerchiamo di capire.

Ogni sito web è generalmente formato da pagine HTML che vengono contemporaneamente:

1. Interpretate dal browser per essere mostrate (renderizzate) a video;
2. Indicizzate dai motori di ricerca per essere posizionate nelle SERP (Search Engine Results Page).

1. Il vantaggio SEO di un sito creato con il framework Genesis

È facile che siti molto sofisticati creino problemi sui diversi tipi di browser e dispositivi oggi esistenti, così come è facile che siti pieni di plugin, aggiunte, animazioni etc. possano risultare più complicati da interpretare, con il risultato che tra le molteplici versioni di browser esistenti molte potrebbero non funzionare o non creare gli stessi risultati.

Non è poco: se per ottenere un certo comportamento ti sei basato su un’animazione particolare e la stessa non viene mostrata nella metà dei browser beh… è un po’ come rinunciare alla metà dei clienti potenziali. Concordi?

Stessa cosa per i motori di ricerca, che si ritrovano ad analizzare pagine di codice “inutile” ai loro fini. Di fatto anche il peso stesso delle pagine (e quindi la velocità complessiva del sito) va di pari passo con la loro dimensione. Riepilogando:

Tutti i vantaggi sono frutto della strategia degli sviluppatori di StudioPress: i temi grafici creati per il Genesis Framework sono caratterizzati da un codice estremamente leggero, ripulito da ogni fronzolo inutile, che rende di fatto l’indicizzazione del sito estremamente efficace. È un vantaggio fondamentale rispetto ai temi grafici tradizionali, ed è proprio una questione di approccio: poche cose, fatte bene.

• Sai quanto pesa uno dei temi grafici migliori presenti su ThemeForest? Quasi 25 mega.
• Sai quanto pesa il framework Genesis? circa 500k (mezzo mega)
• E il tema che uso per questo sito? poco più di un mega…

Un ulteriore vantaggio derivato è che il framework Genesis e i suoi Child Theme puoi installarli tutti direttamente dall’interfaccia di WordPress. Sono leggerissimi e quasi tutti i provider ti permettono l’upload di file così piccoli. Per installare un tema da 25 mega devi usare l’FTP. Differenze di tempo per l’installazione? Abissali.

2. La velocità di Genesis

I siti creati con Genesis sono leggeri (il codice ha comunque un peso in termini di dimensione, meno codice = meno peso) e, anche per questo motivo, sono velocissimi. Le strutture standard utilizzate fanno in modo che i motori di ricerca possano navigarli al meglio e interpretarli in ogni loro parte. Ti sembra poco?

Facciamo un esempio pratico: in genere su Genesis anziché usare un plugin sofisticato come può essere un Revolution Slider, si tende ad utilizzare una hero image con del testo sopra (classificato secondo i normali tag html tipici dei titoli etc)

Ora secondo te, quando un motore di ricerca deve analizzare un sito, preferirà trovare un chilo di codice java o una semplice immagine con del testo? Bene. Ti sei risposto.

E non è tutto: quanti problemi di sicurezza potresti avere con un plugin molto complesso rispetto a quanti ne avresti con un’immagine e una scritta? Per tua informazione, negli ultimi due anni alcuni dei buchi di sicurezza più clamorosi di WordPress sono dipesi proprio da uno di questi plugin: il Revolution Slider.

Rifletti: è un approccio che dovrebbe essere la tua guida quando sei alla ricerca di performance e stabilità.

E se questa essenzialità che caratterizza il framework Genesis credi sia sinonimo di siti brutti e poveri ti lascio con una massima di Peete Seeger: “Qualsiasi sciocco può fare qualcosa di complesso; ci vuole un genio per fare qualcosa di semplice.”

Un’altro dei vantaggi di utilizzare il Framework Genesis è proprio che, grazie alla tua semplicità, ti spinge a trovare soluzioni creative semplici. Le più difficili e al tempo stesso le più belle.

Altri vantaggi del Genesis Framework di StudioPress

Come abbiamo già visto nella prima parte di questo articolo, Genesis è un framework per WordPress concepito per essere veloce, leggero e molto sicuro. La veste grafica viene fornita attraverso la semplice installazione di Child Themes.

Un framework è un insieme di funzionalità che estende quelle base di WordPress e permette ai child theme di concentrarsi esclusivamente sull’aspetto grafico del sito, anziché sulla funzionalità che viene garantita dal framework. Come abbiamo visto velocità, sicurezza e SEO sono alcune delle ragioni per cui Genesis è il framework più diffuso e rispettato dell’intero ecosistema WordPress.

Ecco gli altri vantaggi

1. Qualità dello sviluppatore:
   StudioPress è lo sviluppatore di Genesis, sulla cresta dell’onda da anni, che ha rifinito continuamente il proprio codice fino a farne uno dei più efficienti e sicuri esistenti. Sul loro sito riportano 189.000 siti sviluppati con Genesis. Non è uno sviluppatore “solitario” che tra 1 settimana potrebbe decidere di abbandonare tutto lasciandoti in braghe di tela (Mi è accaduto fin troppe volte con ThemeForest).
2. Collaborazioni eccellenti:
   La capacità, sempre di StudioPress, di instaurare collaborazioni eccellenti con tantissimi altri sviluppatori, si traduce in garanzia di qualità altissima di tutti i child theme e plugin disponibili.
3. Una community radicata e appassionata
   La comunità che si è sviluppata attorno a questa piattaforma è così attenta e matura che oggi come oggi trovare uno sviluppatore Genesis è facile, e questo assicura stabilità e durata al tuo progetto. Il Geenesis Framework è mantenuto sempre al top, in caso di problemi è presente un forum vastissimo dove scambiare opinioni e avere risposte.
4. Aggiornamenti con 1 click:
   Questa è una delle feature tecniche che preferisco: i necessari aggiornamenti sono sempre installabili con un solo Click. Prova a dirlo a quelli di ThemeForest o di altri.
5. Qualità professionale dei design:
   Semplicità, facilità di utilizzo, design super puliti, velocità di caricamento e codice efficiente, corretto e sicuro. Sono talmente tanti i vantaggi di utilizzare un framework di questo genere che è difficile non prenderlo in considerazione. E i design sono splendidi perché l’esperienza d’uso è immediata, sono funzionali, e nella loro essenzialità ti costringono a pensare soluzioni creative semplici (e quindi comprensibili per tutti)
6. Codice HTML5 Responsive:
   Che si traduce in pagine visibili su qualsiasi dispositivo. Una base fondamentale per ogni progetto moderno.
7. Design e Layout basati su aree Widget:
   Questo è uno degli aspetti più importanti di come lavorare con Genesis, lo vedremo nella terza parte di questo articolo.
8. Licenze estese:
   Compri Genesis, compri un tema e lo installi su quanti siti vuoi. Ti basta per capire quanto sia – oltre che efficiente – anche conveniente?

Che io sia colui che crea siti o colui che ne vuole sfruttare/usare uno, la stabilità dello sviluppatore, il fatto che sia praticamente il primo al mondo è un parametro importante.

I Child Theme di Genesis

Fino a poco più di un anno fa i detrattori di Genesis puntavano il dito proprio verso il design e le opzioni di personalizzazione. In effetti alcuni temi – perlomeno a prima vista – apparivano datati anche come impostazione generale, e normalmente una volta installato un child theme le opzioni grafiche a disposizione erano poche, pochissime (soprattutto se paragonate a temi grafici molto spinti, che integravano nel tema plugin evoluti come il Revolution Slider, il Visual Composer etc).

Nonostante tutto questo continuavo a vedere i blog più veloci e più interessanti del mondo sempre su Genesis. Così ho deciso di approfondire e benedico ancora quel giorno!

Oggi le cose sono cambiate in meglio: ora i temi grafici del Genesis Framework sono davvero spettacolari (perlomeno gli ultimi), moderni e dagli ampi spazi, in modo che l’occhio possa respirare e seguire un percorso logico immediato. Erano così anche i vecchi (ad avere un occhio allenato), tuttavia i nuovi design usciti in questo ultimo anno sono, almeno a mio giudizio, davvero sontuosi.

Quasi ogni child theme supporta le colonne e svariate classi, per cui è possibile costruire tramite widget qualsiasi elemento desiderato. Fai riferimento sempre alla documentazione del tema e alle demo dei produttori per essere certo che possa fare al caso tuo.

[Parte 3] Genesis Framework di Studiopress: Child Theme e Widget

Eccoci finalmente alla terza parte di questo post. Entriamo subito nel vivo di come funzionino i temi grafici di Studiopress, o meglio i Child Theme di Genesis.

Per costruire dinamicamente le pagina, questo framework si affida all’utilizzo di template “arricchiti” di svariate aree widget. In realtà, molte delle differenze tra i diversi child theme sono proprio nella disposizione e nella quantità di queste aree, oltreché ovviamente alla caratterizzazione di font, proporzioni, spaziature e quant’altro.

Così in realtà non ti serve avere fisicamente una pagina Home: ti basterà popolare di contenuti le aree widget specifiche messe a disposizione dal tema child scelto. Nel momento stesso in cui aggiungerai qualcosa ad un’area widget questa si attiverà mostrando il contenuto aggiunto.

Ti spiego meglio con un esempio:

Questo delizioso Child Theme, chiamato Interior Pro, che puoi acquistare sul sito di StudioPress, è un Genesis Child Theme con tre aree widget. Come quasi ogni altro tema di WordPress, è possibile personalizzarlo direttamente dall’interfaccia grafica. In questo caso puoi scegliere il colore dei link (pulsanti, etc) e l’immagine grande della testata. Una volta definiti i menu, sempre dall’interfaccia standard di WordPress, è possibile aggiungere i widget per creare il contenuto della tua home.

Come puoi vedere dall’immagine, in questo abbiamo 3 aree: la prima è stata attivata con un normalissimo widget di testo. C’è il titolo del widget (We Are Interior) un testo di contenuto e un normalissimo pulsante (aggiunto con una riga di HTML)

La seconda area widget, analogamente, contiene un altro widget di testo.

Nella terza sono stati invece aggiunti 3 widget che mostrano ciascuno un post del blog. Il widget dei post utilizzato è specifico del Genesis Framework (ecco un’altra feature intelligente del framework: widget personalizzati esclusivi tra cui post in evidenza, pagina in evidenza, etc).

Immagino ti chiederai come mai 3 widget vengano messi in orizzontale e suddivisi su tre colonne anziché in modo verticale (ovvero uno sotto l’altro) come succederebbe con ogni altro tema wordpress standard. Questa meravigliosa feature è presente in tutti gli ultimi temi Genesis, viene chiamata “Smart Area Widget” ed è un sistema per cui, a seconda dell’area e del tema considerati, i widget vengono renderizzati (cioè mostrati a video) in modo intelligente e dinamico. Più facile da mostrare che da spiegare:

Così nel caso mettessi 2 widget di testo in quella particolare smart area li vedresti affiancati sulla pagina home, mettendone 3 (come nel caso dei post) ne vedresti 3, mettendone 6 ne vedresti 3 sopra e 3 sotto e via dicendo. Ricorda: ogni child theme di Genesis potrebbe avere Smart Area Widget diverse. Controlla sempre la documentazione del tema prima di procedere all’acquisto.

Cosa cambia tra Genesis e i temi grafici tradizionali?

Tutto. Nel senso che non avendo una pagina Home dedicata, è fondamentale che tu riesca a costruirla attraverso i widget. La cosa potrebbe sembrare strana, invece risulta essere una delle feature più potenti di tutto il framework.

Il fatto che vengano supportate in generale le colonne permette di suddividere le aree widget praticamente in ogni modo, per cui ogni soluzione grafica diventa possibile, a condizione di conoscere un minimo di HTML e di CSS per rifinire al meglio ogni dettaglio.

Al momento i produttori di temi child dedicati a Genesis forniscono quasi sempre delle aree widget a piena larghezza, pertanto per spezzare il contenuto del widget stesso in diverse colonne dovrai applicare normalissimo codice HTML. Non ti preoccupare, ti basta avere un minimo di dimestichezza e non essere un programmatore. Ogni tema fornisce infatti esempi pronti per essere provati, e l’opzione di avere un costruttore grafico è sempre disponibile, ad esempio attraverso plugin premium come Thrive Content Builder o anche come lo stesso plugin di Optimize Press.

Per quanto mi riguarda, la costruzione di splendide Home page è semplicissima da realizzare giocando con i Widget, inoltre si ha un ottimo controllo per quanto riguarda i contenuti e i tag degli stessi, così da semplificare anche gli aspetti SEO.

Il codice ultra performante e semplificato di Genesis è la scelta migliore anche per l’integrazione con altri sistemi:

• pochissimi i problemi di compatibilità
• performance esagerate
• SEO perfetto grazie alla qualità e alla pulizia del codice HTML

Dopo un minimo di ambientazione, necessaria per prendere dimestichezza con il sistema totalmente a widget, il Genesis Framework di StudioPress ti garantirà la migliore riuscita tecnica dei tuoi progetti.

Quanto costa il Genesis Framework?

Facciamo chiarezza: ogni child theme che compri da StudioPress è comprensivo del framework e costa 99,95 dollari. Il tema acquistato sarà tuo per sempre, con tutte le modifiche che dovessero fare, e potrai utilizzarlo per ogni sito che vorrai. Un bel risparmio se paragonato ad altri tipi di licenze.

Una volta che hai fatto il primo acquisto e che quindi hai Genesis poi i child theme aggiuntivi costano 44,95 l’uno (a volte cambiano in base alle offerte).

Se vuoi solo il framework costa 59,95 e chiaramente lo puoi acquistare solo da StudioPress.

Quando compri un child Theme come Refined da produttori di terze parti il framework non c’è mai, lo devi quindi avere già acquistato da StudioPress.

Un’altra cosa che ci tengo a ripetere è che i child theme sviluppati da StudioPress hanno quasi tutti le smart widget area (guarda sopra nel post per capire meglio di cosa si tratti). I child theme sviluppati da terze parti ancora non le hanno, quindi considera bene cosa devi fare prima di scegliere.

Vuoi creare il tuo blog con WordPress e Genesis?

Vuoi creare anche tu il tuo blog con WordPress e Genesis? Abbiamo creato un corso online proprio su questo argomento. Più che un semplice corso è un per-corso, un intero sito organizzato e dedicato ad un unico obiettivo: farti andare online con un blog professionale, perfettamente funzionante, basato su WordPress e sul Genesis Framework.

Scopri il corso, iscriviti e inizia a creare il tuo blog. All’interno troverai approfondimenti su tutti gli aspetti di Genesis, tutte le indicazioni per installare ogni plugin che usiamo nei nostri siti, bonus di enorme valore strategico (SEO, Organizzazione del blog, e tanti altri), sorprese, link a tutte le risorse, etc.

Assieme al corso ti daremo accesso ad un gruppo chiuso su Facebook, dove ti terremo aggiornato su tutti i nuovi contenuti che andremo ad aggiungere e dove tu avrai la possibilità di proporre nuovi argomenti e di parlare con noi. È un’occasione unica per far sul serio e iniziare la tua nuova avventura online. 

Per ora è tutto, spero di incontrarti dall’altra parte e in bocca al lupo per i tuoi progetti!