Iniziamo il nostro percorso che ci porterà a conoscere i segreti dello sviluppo dei temi per WordPress.
Questo primo incontro in particolare sarà dedicato a scoprire la gerarchia dei temi di WordPress, il dettaglio dei file che compongono un tema e le priorità che ciascun file possiede.
In seguito vedremo cosa sono e come creare i child theme, le loro potenzialità e importanza nell'ecosistema WordPress e infine, inizieremo ad entrare nel vivo dello sviluppo di un tema WordPress scoprendo quali sono i framework più importanti e maggiormente utilizzati dagli sviluppatori nella creazione di un tema WordPress.
6. WordPressMeetupLecce.
Perché Sviluppare un Tema WP01.
1. Perché sei tu a scegliere
2. Perché sei indipendente dagli aggiornamenti
3. Per sfruttare i template personalizzati
4. Perché permette di inserire le funzionalità che ti servono
5. Perché puoi creare qualcosa di unico
6. Perché impari il codice
7. Perché avrai un sito veloce e ottimizzato
8. Perché è creativo
9. Perché è divertente
10. Perché puoi guadagnarci!
8. WordPressMeetupLecce.
Anatomia di base02.
Prima di addentrarci in un tema WordPress vediamo la sua anatomia di base...
· Header: rappresenta l'intestazione e contiene i tag
<head>, <doctype> , <meta> e il <body>
· Content: è il blocco del contenuto e contiene gli articoli
del blog, il contenuto del sito, ecc.
· Footer: contiene le informazioni che vanno nel piè di
pagina, copyright, menù secondari, ecc.
In base al bisogno si possono creare anatomie più complesse attraverso
altri file che definiremo nel nostro tema.
9. WordPressMeetupLecce.
Anatomia di base02.
Ma come si "crea" una pagina contenuto di WordPress?
I file necessari sono solo 3:
· Style.css: file di stile del nostro tema e metodo di
dichiarazione del tema stesso.
· Index.php: file di base di generazione del contenuto
attraverso il Loop
· Function.php: (opzionale), contiene funzioni speciali
associate al tema o al sito.
11. WordPressMeetupLecce.
Anatomia Complessa03.
WordPress ti consente di definire modelli separati per i
vari aspetti del tuo sito.
Non è essenziale disporre di tutti questi file modello per il
tuo sito affinché funzioni completamente. I modelli
vengono scelti e generati in base a una gerarchia.
Come sviluppatore di temi, puoi scegliere la quantità di
personalizzazione che desideri implementare utilizzando i
modelli. Ad esempio, come caso estremo, puoi utilizzare solo un
file modello, chiamato index.php come modello per tutte le pagine
generate e visualizzate dal sito. Un uso più comune è fare in
modo che diversi file modello generino risultati diversi, per
consentire la massima personalizzazione.
12. WordPressMeetupLecce.
Anatomia Complessa03.
Vediamo alcuni file template...
style.css
Il foglio di stile principale. Questo deve essere incluso con il tuo tema e
deve contenere l'intestazione di informazioni per il tuo tema.
index.php
Il modello principale Se il tuo tema fornisce i propri
modelli, index.php deve essere presente.
comments.php
Il modello dei commenti.
front-page.php
Il modello della prima pagina.
home.php
Il modello di pagina iniziale, che è la prima pagina per impostazione
predefinita. Se si utilizza una prima pagina statica, questo è il modello per
la pagina con i post più recenti.
single.php
Il modello di singolo post. Utilizzato quando viene interrogato un
singolo post. Per questo e tutti gli altri modelli di
query, index.phpviene utilizzato se il modello di query non è presente.
singolo-{post-type} .php***
Il singolo modello di post utilizzato quando viene interrogato un
singolo post da un tipo di messaggio personalizzato. Ad
esempio, single-book.php verrebbe utilizzato per la visualizzazione di
singoli post dal tipo di post personalizzato denominato
"book". index.php viene utilizzato se il modello di query per il tipo di
post personalizzato non è presente.
page.php
Il modello di pagina. Utilizzato quando viene interrogata una
singola pagina.
archive.php
Il modello di archivio. Utilizzato quando viene richiesta una categoria,
un autore o una data. Si noti che questo modello verrà sovrascritto
da category.php , author.php e date.php per i rispettivi tipi di query.
15. WordPressMeetupLecce.
Il Loop di WordPress04.Il Loop rappresenta un ciclo che interroga il database e
che è in grado di mostrare informazioni rilevanti
riguardanti i dati contenuti in esso.
Immaginiamo il Loop come un magazziniere incaricato di
fare un inventario, l’unica differenza che avremo da un
magazzino reale è che nelle scatole del nostro magazzino
non saranno presenti oggetti, ma informazioni riguardanti i
nostri articoli. A questo punto il magazziniere prende le
indicazioni che gli abbiamo passato e inizia a controllare
una ad una le varie scatole, stampando a video le
informazioni che abbiamo richiesto.
20. WordPressMeetupLecce.
Creiamo il file index.php05.
Creiamo un nuovo file che chiameremo
index.php nel quale inseriremo il loop
principale e definiremo poi gli elementi
da visualizzare.
All'interno del loop abbiamo definito un altro template
separato nel quale definiremo gli elementi che andranno
visualizzati dei nostri post.
22. WordPressMeetupLecce.
Creiamo il file page.php05.
Creiamo un nuovo file che chiameremo
page.php nel quale definiremo come
visualizzare il contenuto delle nostre
pagine statiche.
All'interno di questo file abbiamo inserito le specifiche di
controllo delle sidebar destra e sinistra, in seguito
abbiamo inserito un loop che indirizza ad un altro file
esterno che governa il contenuto delle pagine.
24. WordPressMeetupLecce.
Creiamo il file single-{post-type}.php05.
Il file single.php controlla la
visualizzazione dei post singoli, ma se
abbiamo un Custom Post Type
possiamo definire un template
specifico, come ad esempio single-
camere.php
Quello che voglio ottenere è una visualizzazione
personalizzata per il Custom Post Type "Camere", tale da
essere diverso dai singoli articoli (del file index.php) e delle
pagine statiche (del file page.php).
27. WordPressMeetupLecce.
Template personalizzati06.
Possiamo creare template personalizzati in base alle categorie, ai singoli ID, in base ai CPT, alle
tassonomie dei CPT, agli archivi, ecc
Immaginiamo di voler visualizzare degli elementi
aggiuntivi SOLO per una categoria di post del nostro sito. Ci
basta duplicare il file category.php (file archivio di categoria) e
chiamarlo category-idnostracategoria.php e qui inserire gli
elementi e le personalizzazioni che desideriamo.
Da questo momento quando l’utente visualizzerà la categoria
vedrà il contenuto che noi abbiamo deciso in precedenza.
Con la stessa filosofia funzionano anche i
file page.php, single.php, ecc.