Un tema WordPress per tutti

Sotto al titolo del blog, sulla sinistra, proprio sopra la barra di navigazione, è presente uno “switch”, che permette di passare ad un tema grafico alternativo, più precisamente “chiaro”.

Il tema grafico di un blog viene scelto dal proprietario del blog stesso, sia se lo si è creato a mano, sia se lo si è scaricato dalla rete. Il risultato finale, tuttavia, oltre a soddisfare “noi” proprietari deve essere gradito dai nostri visitatori che non sempre apprezzano determinate scelte di layout. Per alcuni sarà banale, per altri meraviglioso, per altri ancora tremendamente fastidioso! Perché, quindi, non far scegliere al “visitatore” il layout con cui visualizzare il nostro blog?

Tutto nasce dalle sollecitazioni di Emanuele di proporre una versione “chiara” di undolog.com! Come dargli torto? Tuttavia, se seguissi i suoi consigli, dovrei farlo anche con altri e la conseguenza sarebbe quella di ritrovarsi a cambiare tema ogni settimana! Nonostante questo siete voi “lettori/visitatori” a leggere il blog, quindi perché non fornirvi uno strumento in grado di farvi sceggliere la miglior visualizzazione possibile? Insieme ad altre interessanti prospettive…

Inoltre c’è chi non è mai sempre pienamente soddisfatto del tema che possiede (vedi Napolux) ed uno strumento come WP Choose Your Theme potrebbe, in parte, risolvere il problema, garantendo un doppia navigazione su un tema nuovo, o in prova, e quello consolidato per gli “affezionati”.

Così ho dato ascolto ad Emanuele e ho creato una versione “chiara” di questo blog. Ho realizzato, per l’occasione, un semplice plugin che permette di visualizzare la lista dei temi disponibili e selezionarli dal front-end di WordPress. In pratica saranno i visitatori a scegliere come visualizzare il Blog!

WP Choose Your Theme

WP Choose Your Theme è il plugin per WordPress in grado di far scegliere al visitatore il tema da utilizzare. La scelta viene memorizzata tramite Cookie e, in questa versione, mantenuta per un mese circa. Il suo funzionamento è davvero semplice: basta installarlo, attivarlo, nascondere, tramite le configurazioni, i temi che non vogliamo far selezionare ai nostri visitatori e inserire questa riga nei “vostri template, ad esempio nella sidebar (sidebar.php):

1
2
<h2>Scegli il tema</h2>
<?php wp_chooseyourtheme(); ?>

I temi permessi saranno visualizzati in combo menu. Quando il visitatore seleziona un tema, questo sarà memorizzato nel cookie e la pagina ricaricata. In questa release il plugin permette tre tipi di visualizzazione.

Parametri

La lista dei temi può essere presentata in tre modalità:

Combo menu

1
2
3
4
<h2>Scegli il tema</h2>
<?php wp_chooseyourtheme(); ?>
// oppure
<?php wp_chooseyourtheme("mode=menu"); ?>

Questo genera un HTML:

1
2
3
4
5
<select class="wpcyt_combo">
 <option>Theme name 1</option>
 <option selected="selected">Theme name 2</option>
 <option>Theme name ...</option>
</select>

Lista

1
2
<h2>Scegli il tema</h2>
<?php wp_chooseyourtheme("mode=list"); ?>

In questo modo viene generato un codice HTML altamente personalizzabile, come nell’esempio qui sotto:

1
2
3
4
5
<ul class="wpcyt_list">
 <li class="nome-tema-1"><a href="..."><span>Nome tema 1</span></a></li>
 <li class="nome-tema-2 selected"><a href="..."><span>Nome tema 2</span></a></li>
 <li class="nome-tema-n"><a href="..."><span>Nome tema n</span></a></li>
</ul>

Il tema corrente viene indicato con l’aggiunta della classe selected nel tag li. Nella versione combo menu il tema corrente è automaticamente selezionato nella lista.

Roll

1
2
<h2>Prossimo tema</h2>
<?php wp_chooseyourtheme("mode=roll"); ?>

In questo caso viene creato un unico link che punta al tema successivo, ciclando di fatto tutti i temi disponibili:

1
2
3
<div class="wpcyt_roll">
 <a class="prossimo-tema" href="#"><span>Prossimo Tema</span></a>
</div>

Vantaggi e potenzialità

Come detto all’inizio il principale vantaggio lo si offre al navigatore che può impostare un tema di navigazione rispetto ad un altro. Maggiore è il numero dei temi messi a disposizione e maggiore sarà la capacità di soddisfare le diverse esigenze dei nostri navigatori. Un tema, poi, in WordPress, non rappresenta solo un mero aspetto grafico. Oltre al “semplice” layout, che comprende la resa grafica, i colori, il tipo di font e il posizionamento dei contenuti, bisogna aggiungere la capcità di WordPress di poter essere personalizzato nella visione di questi contenuti. Con l’introduzione di opportune funzioni è infatti possibile aggiungere un diverso modo di fruire il Blog che non si limita al semplice cambio di aspetto.

Svantaggi e avvertenze

Tutto questo ha ovviamente un prezzo, pagato per intero dal possessore del blog. In prima analisi risulta evidente che più temi significano maggior onere nella manutenzione ordinaria del Blog. Qualsiasi aggiunta fatta su un tema deve necessariamente essere riprosta su un altro: bottoni PayPal, banner e tutti gli elementi che esonerano dal contenuto del database WordPress. Ad esempio lo stesso Plugin WP Choose Your Theme anche se installato al livello “globale”, richiede l’inserimento manuale dell’istruzione wp_chooseyourtheme() nella sidebar (sidebar.php), ad esempio. Se abbiamo messo a disposizione tre temi, su tutti e tre va inserita l’istruzione, altrimenti al cambio del tema l’utente non saprebbe come tornare indietro o selezionare un tema diverso.

Inoltre, come accennato sopra, l’uso dei cookie per informare il sistema che quel particolare utente ha scelto quel particolare tema, potrebbe entrare in conflitto con alcuni Plugin. Ad esempio io ho avuto qualche problema con WP Super Cache, non nuovo a questo tipo di problematiche. Tuttavia penso di aver risolto la cosa modificando il file .htaccess. Cercate la/le righe:

1
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress|wp-postpass_).*$

e modificatele in:

1
RewriteCond %{HTTP:Cookie} !^.*(comment_author_|wordpress|wp-postpass_|wpcyt_name).*$

wpcyt_name è il nome del cookie usato da WP Choose Your Theme

20 commenti a: “Un tema WordPress per tutti”

  1. 04 giu, 2009 Saidmade» WP Choose your theme: Wordpress multi-themes:

    [...] WP Choose Your Theme è un Plugin per WordPress in grado di far scegliere ai nostri visitatori il tema grafico da utilizzare durante la navigazione del nostro blog. Le origini di questo progetto potete trovarle in Un tema WordPress per tutti. [...]

  2. 04 giu, 2009 Ghido:

    Ottimo plugin!

    Per il problema di dover aggiornare tutti i temi ogni volta, si potrebbero creare i temi alternativi utilizzando i child themes, non credi?

    RispondiQuota
  3. 04 giu, 2009 Napolux:

    Non ci sono già plugin che fanno questa cosa tipo theme switcher? :P

    RispondiQuota
  4. 04 giu, 2009 Napolux:

    P.s.
    Mille volte meglio il tema chiaro, se posso permettermi :P Con qualche aggiustatina grafica sarebbe perfetto. :P

    RispondiQuota
  5. 04 giu, 2009 Emanuele:

    Complimenti per l’attenzione mostrata verso i tuoi utenti! ;-)
    Riguardo al tema, come già detto da Napolux, andrebbero corrette un paio di cose. Immagino sia ancora sotto lavorazione ma ad esempio i bottoni verdi nei commenti sono bruttini.
    Altra cosa… perché non lavori di CSS invece di dover creare completamente un template nuovo con path totalmente diverse per le immagini (ovviamente alcune scelte andrebbero riviste: vedi ad esempio il bottone di invio commento…)?
    Ciao,
    Emanuele
    PS: confermo che plugin del genere esistevano già! :-P

    RispondiQuota
  6. 04 giu, 2009 Giovambattista Fazioli:

    @Napolux:

    Non ci sono già plugin che fanno questa cosa tipo theme switcher?

    Si, ne esistono già… ma meglio farselo per conto proprio :) Poi spero che il mio sia meglio :)

    RispondiQuota
  7. 04 giu, 2009 Giovambattista Fazioli:

    @Napolux:

    Con qualche aggiustatina grafica sarebbe perfetto

    Suggerisci… suggerisci… :)

    RispondiQuota
  8. 04 giu, 2009 Giovambattista Fazioli:

    @Emanuele: ci sarebbero anche soluzioni diverse. Tuttavia ho scelto quella più brutale e ridondante per permettere di agire effettivamente su tutti i file del tema. Il mio obiettivo, infatti, non è solo quello di cambiare l’aspetto grafico inteso come colori e immagini, ma di permettere di modificare anche la navigazione avendo a disposizione nuovi template, funzioni aggiuntive nel file functions.php, etc…
    Pian paino, comunque, grazie ai vostri suggerimenti, sistemerò i dettagli della versione “white”… :)

    RispondiQuota
  9. 04 giu, 2009 Sniper Wolf:

    Molto carina questa versione bianca. Ho notato però che il bannerino di Adsense, sotto i tags, è rimasto nero con link verdastri ;)

    Comunque un buon lavoro, anche se a me piace molto più la versione black di Undolog.

    Ciao

    RispondiQuota
  10. 04 giu, 2009 Giovambattista Fazioli:

    @Sniper Wolf:

    Ho notato però che il bannerino di Adsense, sotto i tags, è rimasto nero

    Si, questo accade perchè AdSense è un servizio esterno impostato al di fuori del contesto del tema. Quello che dovrei fare (tempo tiranno…) è creare un nuovo AdSense per questo tema… provvederò quanto prima :)

    RispondiQuota
  11. 04 giu, 2009 Giovambattista Fazioli:

    @Ghido:

    Per il problema di dover aggiornare tutti i temi ogni volta, si potrebbero creare i temi alternativi utilizzando i child themes, non credi?

    Ottima osservazione! In realtà non ho citato i Child Theme di WordPress perchè sono poco conosciuti e anche poco usati, almeno dalla stragrande maggiornaza dei blogger non tecnici. Spesso, infatti, risulta più semplice (ed è anche la procedura più nota) installare diversi temi, separandoli quindi in cartelle fisiche.
    Tuttavia la tua osservazione è giustissima e i Child Theme sarebbero la soluzione ottimale per chi vuole creare una variante del proprio tema sfruttando l’ereditarietà con il tema padre. Argomento su cui si potrebbe discutere prossimamente… :)

    RispondiQuota
  12. 04 giu, 2009 camu:

    Giovambattista, non stare a sentire Emanuele tutte le volte, è uno che sta conducendo una battaglia in giro per tutta la blogosfera per togliere i temi neri. Scherzi a parte, questa versione chiara è davvero carina e più leggibile. Dalle mie parti il tema cambia una volta al mese, ma se mi dicevi che stavi lavorando ad un plugin avrei aspettato! In mancanza, ho inserito un po’ di controlli e funzioni all’interno del mio tema, per fare una cosa simile alla tua. Nel mio caso ho 12 temi, uno per ogni mese. Più 2 ad alto contrasto: chiaro e scuro. L’utente può scegliere quale usare, come ho spiegato da poco in un mio articolo. Non ho reso facile il cambio perché vorrei che comunque la maggioranza continuasse ad usare quello che IO scelgo, in fondo sono il padrone di casa, no?

    RispondiQuota
  13. 04 giu, 2009 Giovambattista Fazioli:

    @camu: :) come darti torto…

    RispondiQuota
  14. 05 giu, 2009 Emanuele:

    Ahaha camu! Ne va dell’eleganza! :-P
    I temi neri li vedevo bene 10 anni fa! ;-)
    Ciao,
    Emanuele

    RispondiQuota
  15. 06 giu, 2009 Il meglio della settimana #20 | BigThink:

    [...] Un tema WordPress per tutti WP Choose Your Theme, un plugin creato ad hoc per permettere al visitatore di scegliere quale tema mostrare sul tuo blog. [...]

  16. 07 giu, 2009 Best of Week #23 | Gioxx's Wall:

    [...] Un tema WordPress per tutti [...]

  17. 07 giu, 2009 I migliori post della settimana #27 | EmaWebDesign :: Web Programming / Web Design:

    [...] 4) Un tema WordPress per tutti [...]

  18. 10 giu, 2009 Davide Salerno:

    Con Safari 4 non funge lo switch del tema… potrebbe essere un problema di Javascript :-(

    RispondiQuota
  19. 10 giu, 2009 Giovambattista Fazioli:

    @Davide Salerno: si, su Safari ha un comportamento anomalo, sia su Mac che su Windows. Potrebbe essere dovuto alla cache interna di Safari. Su Mac il cambio del tema mi ha funzionato, ma a fasi alterne. Indago… (su Windows Safari è andato anche in crash)

    RispondiQuota
  20. 05 ott, 2009 Saidmade» WP Choose your theme:

    [...] WP Choose Your Theme è un Plugin per WordPress in grado di far scegliere ai nostri visitatori il tema grafico da utilizzare durante la navigazione del nostro blog. Le origini di questo progetto potete trovarle in Un tema WordPress per tutti. [...]

Lascia un commento

TAG XHTML PERMESSI: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> INSERIMENTO CODICE: 
<pre></pre> // blocco generico
					<code></code> // blocco generico
					[cc_actionscript][/cc_actionscript] // Actionscript
					[cc_actionscript3][/cc_actionscript3] // Actionscript 3
					[cc_css][/cc_css] // CSS Style Sheet
					[cc_html][/cc_html] // HTML
					[cc_js][/cc_js] // Javascript
					[cc_objc][/cc_objc] // Objective-C
					[cc_php][/cc_objc] // PHP
					[cc_sql][/cc_sql] // SQL


Stop SOPA