sviluppare un tema wordpress

Quando iniziai a lavorare con WordPress mi limitavo adadattare i temi altrui alle mie esigenze o a quelle del cliente, ma successivamente ho deciso che le metodologie meritavano di essere approfondite.

Più mi avventuravo nel mondo WordPress, più mi rendevo conto che sarebbe stato uno strumento fondamentale per la mia attività e apprendevo le principali nozioni di sviluppo con vera e propria ingordigia. Nel tempo e con l’esperienza, notai che alcune funzioni venivano implementate in ogni progetto, ed era quindi possibile creare un “kit di partenza”, in modo da poterle implementare al volo ogni qualvolta si sviluppa un nuovo tema.

Nei miei file functions.php non possono mancare 10 funzioni, che ritengo fondamentali nello sviluppo di un tema:

1 – Funzione per abilitare l’immagine in evidenza

Introdotta nella versione 2.9 di WordPress con il nome di Post Thumbnails e ribattezzata nella versione successiva come Featured Images (immagini in evidenza), questa funzione da la possibilità di caricare un’immagine, con il compito di rappresentare il post, la pagina o il Custom Post.

Inserendo il codice riportato qui sopra la funzione creerà nella pagina editor dei testi, un box per caricare l’immagine desiderata.

Attualmente sto sviluppando un progetto personale basato su WordPress, il quale necessita di tre grandezze differenti per le miniature dell’articolo. Per fare ciò basterà utilizzare la funzione add_image_size(); la quale permette di registrare una nuova grandezza per l’immagine in evidenza.

Per apportare questa modifica in WordPress basterà inserire queste tre righe di codice nel file functions.php:

La struttura generale della funzione e dei suoi utilizzi avanzati, si trova nel codex.

2 – Tag “Continua a leggere” personalizzato

Ci sono molti blogger che nella pagina principale del blog inseriscono una breve “anteprima” dell’articolo. Questo genere di “anteprime”, se così vogliamo definirle, vengono concluse di default con […] che stanno ad indicare che c’è un seguito a quanto anticipato.
Per sostituire i tre puntini con qualcosa di più elegante, basterà scrivere questa semplice funzione nel file functions.php:

Ciò permetterà di sostituire i tre puntini la scritta “Continua a leggere”. La classe css serve solo a dare dello stile per rendere più visibile il link all’articolo. Si può in alternativa lasciarlo invariato e sarà visualizzato come un normalissimo link.

3 – Paginazione di base

Ogni template WordPress ha la sua paginazione personalizzata. Questa però può anche essere utilizzata come punto di partenza per elaborare in seguito qualcosa di più complesso. Le funzioni base per la paginazione sono previous_post_link() e next_posts_link().

4 – Sidebar Dinamica

Sviluppare un tema WordPress ha molti vantaggi. Ti è mai capitato di aver bisogno di più di una sidebar? Realizzarne una personalizzata è semplicissimo, basterà aggiungere il codice che segue, all’interno del file functions.php

Questo codice registra e definisce una Sidebar chiamata “Blog Sidebar” e il suo relativo markup HTML.

Se una Sidebar non ti soddisfa potrete sempre copiare il codice appena scritto e cambiarne il nome!
Le Sidebar offrono centinaia di spunti…. Consultate una pagina dedicata nel codex di wordpress.

5 – Menu personalizzato

Nella versione 3.0 di WordPress è stata introdotta, per la prima volta, la possibilità di creare e gestire dei menu nei temi.
Quando si inizia a sviluppare un tema WordPress da zero, tendenzialmente i menu ever green nei template sono: quello principale, collocato nell’header e un secondario collocato nel footer.

Registrare nuovi menu è facile come bere un bicchiere d’acqua, basterà inserire la seguente funzione nel solito file functions.php

Una volta salvato il file i menu sono stati registrati e sono pronti all’uso. Per visualizzare a video il tutto, è necessario inserire nel file header.php il codice che segue:

In questo modo lascerete tutto come di default, ma per modificare altri parametri del menu c’è una pagina del codex dedicata.

Per includere il menu secondario nel footer, basterà inserire il codice che segue nel file footer.php:

6 – Nascondere la barra di amministrazione (durante lo sviluppo)

Molti converranno con me che la barra di amministrazione durante lo sviluppo di un template, è davvero odiosa!
Mi è capitato più di una volta che si nascondesse qualche elemento dell’header. Fortunatamente WordPress offre la possibilità di rimuoverla con questa semplice funzione:

7 – Filtrare i risultati di ricerca

Tipicamente impiegata per la ricerca dei post “vecchiotti” nel blog, la ricerca interna che ci fornisce WordPress di default, restituisce sia pagine che post. Facciamo un esempio: se vogliamo che un utente ottenga i risultati di una determinata tipologia dei post del blog, il codice quindi sarà il seguente:

8 – Immagini personalizzate nell’header

Per inserire un’immagine personalizzata nell’header del proprio sito in un file functions.php, basterà inserire il seguente codice:

Una volta definite larghezza e altezza, è necessario stabilire l’immagine di default da utilizzare (nel caso non ne venga caricata una personalizzata). E’ anche possibile caricare un’altra immagine che sostituisca quella di default.

9 – Posts Formats

Introdotto nella versione 3.1 di WordPress, un Post Format è un pezzo di meta informazione che può essere utilizzato per un tema legato alla personalizzazione per la presentazione di un post.

WordPress prevede attualmente 9 formati:

  • aside
  • gallery
  • link
  • image
  • quote
  • status
  • video
  • audio
  • chat

I Posts Formats possono essere attivati tramite l’apposita funzione nel file functions.php

Nello snippet riportato sopra viene attivato solamente il formato aside e gallery.

Per maggiori informazioni sui Posts Formats consultate la pagina del codex che ti aspetta!

10 – Load Text Domain

Un piccolo passo verso la possibilità di rendere disponibile una versione tradotta del proprio tema.

La funzione Load_Theme_Text Domain() deve essere attivata generalmente all’interno del gancio after_setup_theme, che generalmente viene utilizzato per svolgere attività di setup di base e registrazioni, conseguentemente al caricamento del tema.

A questo punto basta aggiungere una cartella ‘lingue’ nella directory del tuo tema.
Per ulteriori informazioni sulla funzione load_theme_textdomain() puoi consultare il codex.

Conclusioni

Insieme al Reset CSS questo è il secondo kit di partenza per realizzare un tema wordpress. Tu hai altre funzioni da consigliare? Hai anche tu un kit di partenza? Raccontami tutto…