La struttura di un tema WordPress - files.meetup.comfiles.meetup.com/19813402/Capire WP- la...
-
Upload
trinhnguyet -
Category
Documents
-
view
214 -
download
0
Transcript of La struttura di un tema WordPress - files.meetup.comfiles.meetup.com/19813402/Capire WP- la...
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
La struttura di un tema WordPress
Basi per lavorare correttamente alla creazione o modifica di temi
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Francesco Grasso
@francgrassoWordPress Developer & Trainer
fb.me/francesco.acieffegidesign.it
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Esigenza: creare un nuovo tema / modificare un tema già
presente
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Non avere fretta!
Non iniziare a modificare in maniera compulsiva tutti i file che ti
capitano a tiro.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Breve analisi della struttura file di WordPress
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Quali file compongono WordPress?
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
File di configurazione principali
● Index.php - il file da cui tutto ha inizio. Richiama blog-header.php e poi tutto il core tramite wp-load.php
● wp-load.php - Il file di WordPress che avvia il processo di bootstrap (avvio) individuando wp-config.php ecc
● .htaccess – WordPress usa questo file per gestire permalink, redirect e altre direttive lato server
● wp-config.php – Questo file contiene varie configurazioni tra cui la connessione tra WordPress ed il database. Contiene anche impostazioni globali.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Configurazione db su file wp-config.php
// ** MySQL settings - You can get this info from your web host ** ///** The name of the database for WordPress */define('DB_NAME', 'il_mio_db');
/** MySQL database username */define('DB_USER', 'utente_db');
/** MySQL database password */define('DB_PASSWORD', 'password_db');
/** MySQL hostname */define('DB_HOST', 'localhost');
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Altri file importanti della root principale
● wp-signup.php, wp-login.php, e wp-activate.php - Si occupano del processo di
registrazione, login e conferma utente.
● wp-comments-post.php - Gestione dei commenti e prevenzione di commenti
duplicati.
● wp-settings.php - Impostazione di alcune variabili comuni di WordPress.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Directories
wp-admin wp-includes wp-content
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Directories
wp-admin wp-includes wp-content
CORE PARCOGIOCHI :)
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
!Importante!
Non modificare mai file contenuti nel Core di WordPress!
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
!Importante!
Non modificare mai file contenuti nel Core di WordPress!
(a meno che tu non sia un contributor che sviluppa sul trunk)
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Analisi del Core
/wp-adminContiene funzioni e template necessari all’area admin di WordPress.
/wp-includesContiene classi, funzioni ed utility varie di WordPress
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Leggi e studia il Core!
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
File del Core che andrebbero analizzati
● /wp-includes/general-template.phpContiene funzioni legate ai template
● /wp-includes/functions.phpContiene funzioni di ogni tipo
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
File del Core che andrebbero analizzati
● /wp-includes/formatting.phpFunzioni riguardanti formattazione di ogni tipo (date, testi, ecc)
● /wp-includes/pluggable.phpFunzioni sovrascribili da usare come base di partenzaper crearne di nuove
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
/wp-content
Lo spazio dove lavorare. Anche qui ci sono diverse cartelle.
● languages
● upgrade
● uploads
● plugins
● themes
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
/languages
WordPress posiziona qui i file di lingua della tua installazione, dei temi e dei plugin. Questi file provengono da GlotPress
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
/upgrade
Directory utilizzata in maniera temporanea da WordPress durante il processo di update.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
/uploads
In una struttura ordinata di cartelle e sottocartelle vengono qui organizzati tutti i file caricati mediante temi e plugin utilizzando l’uploader di
WordPress
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
/plugins
Tutti i plugin (componenti aggiuntivi) che installiamo sul nostro sito WordPress vanno automaticamente qui. Durante un’ installazione manuale
il plugin va caricato qui.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
/themes
Tutti i temi che installiamo sul nostro sito WordPress vanno automaticamente qui. Durante un’ installazione manuale il tema va caricato
qui.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Aspetta un momento… tema o template?
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Che cos’è un tema? (1)
Un tema è una collezione di file che specifica come il sito web debba apparire.
Permette di cambiare il look a un sito creato con WordPress senza perdere dati e funzionalità.
Come già detto, è possibile avere più temi all’interno della cartella themes, ma è possibile attivarne
solo uno per volta.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Che cos’è un tema? (2)
Un tema è composto da diversi file .php, .html, CSS e Javascript, questo perché WordPress utilizza
una struttura di tipo modulare. Ogni file, infatti, si occupa di far visualizzare una sezione di sito ben
precisa al visitatore.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Che cos’è un tema? (3)
Il numero di file varia da tema a tema, a seconda delle esigenze o delle scelte fatte dallo
sviluppatore, e può essere definito dalla coppia di file (index.php + style.css) che è la condizione
necessaria affinché un tema possa essere considerato tale, oppure potremmo trovare all’interno
del tema una struttura molto più complessa con decine e decine file e cartelle.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
File principali di un tema
● functions.php: serve a modificare le funzionalità al tema, tramite l’aggiunta di codice PHP personalizzato.
● style.css: è il foglio di stile principale del tema e può essere modificato per personalizzare la grafica. All’inizio del file si trova una parte comment-data contenente tutte le informazioni del tema: autore, nome del tema, url dell’autore ecc.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
File principali di un tema
● functions.php: serve a modificare le funzionalità al tema, tramite l’aggiunta di codice PHP personalizzato.
● style.css: è il foglio di stile principale del tema e può essere modificato per personalizzare la grafica. All’inizio del file si trova una parte comment-data contenente tutte le informazioni del tema: autore, nome del tema, url dell’autore ecc.
“Hei! Ho creato due file in una cartella e realizzato il mio primo tema! Cool!”
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
TwentySixteen
Ci sono più di due file in ogni
tema ovviamente :)
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Processo di visualizzazione WordPress (1)
Il primo file che viene preso in considerazione è index.php, il quale si fa carico di richiamare il wp-
config.php dove vengono caricate tutte le costanti definite all’interno del file. Il wp-config.php
richiama a sua volta il wp-settings.php che include le librerie di WordPress. infine, si procede al
caricamento dei plugin e poi del tema.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Processo di visualizzazione WordPress (2)
Il primo file del tema che viene richiamato è il file functions.php e successivamente avviene
l’ inizializzazione, che rappresenta il momento che avviene un attimo prima del caricamento della
header del tema ( init ).
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Processo di visualizzazione WordPress (3)
Il primo file del tema che viene richiamato è il file functions.php e successivamente avviene
l’ inizializzazione, che rappresenta il momento che avviene un attimo prima del caricamento della
header del tema ( init ).
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Processo di visualizzazione WordPress (4)
WordPress è più semplice di quanto tu possa pensare.
Suddividendo a blocchi la struttura di una pagina web è possibile
individuare facilmente i file che la compongono e su cui intervenire.
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Processo di visualizzazione WordPress (5)
Abbiamo visto che ci sono molti file in un tema… Come fa WordPress a decidere quale utilizzare
per mostrare il contenuto della pagina?
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Template Hierarchy
WordPress usa le query string per decidere quale template o set di template debba essere usato per mostrare una pagina/articolo/elemento.
Una query string è l’informazione contenuta nel link della pagina del tuo sito.
( i permalink mascherano un po’ le query string per renderle più “carine”)
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Template Hierarchy
WordPress usa le query string per decidere quale template o set di template debba essere usato per mostrare una pagina/articolo/elemento.
Una query string è l’informazione contenuta nel link della pagina del tuo sito.
( i permalink mascherano un po’ le query string per renderle più “carine”)
Vuoi modificare un tema? Senza i fondamenti della gerarchia template ti sarà tutto più difficile!
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
https://developer.wordpress.org/themes/basics/template-hierarchy
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Devi modificare un tema con la possibilità di tornare al punto di partenza facilmente?
Tema Child
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Tema Child
https://codex.wordpress.org/it:Temi_Child
Come per un tema completo i file principali sono 2:
- style.css
- functions.php
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
/*Theme Name: Twenty Thirteen ChildTheme URI: http://example.com/Description: Tema Child per il tema Twenty ThirteenAuthor: Qui il vostro nomeAuthor URI: http://example.com/about/Template: twentythirteenVersion: 0.1.0*/
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
<?php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' );
function enqueue_parent_theme_style() {
wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}
WordPress Meetup Catania - La struttura di un tema WordPress, Francesco Grasso
Per oggi è finita, ora vai studiare! :D
Questa è stata solo una piccola intro al mondo dei temi WordPress per stuzzicare la tua fantasia, non dimenticare di approfondire gli argomenti a casa o durante il prossimo incontro!