e édition - conception et personnalisation des thèmes wordpress · 2017-04-14 · forums dédiés...

ISBN

: 97

8-2-

409-

0058

4-8

26,5

0 €

Wor

dPre

ss -

Conc

eptio

n et

per

sonn

alis

atio

n de

s th

èmes

WordPress Conception et personnalisation des thèmes

WordPressConception et personnalisation des thèmes

Responsable pédagogique dans un centre de formation et formateur sur les technologies Web et les Arts gra-phiques pendant plus de quinze ans, Christophe AUBRY est aujourd’hui dirigeant de la société netPlume spécialisée dans la rédaction péda-gogique et la création de sites inter-net. Auteur de nombreux livres aux Editions ENI notamment sur Drupal, WordPress, Dreamweaver, HTML et CSS, il intervient régulièrement sur les forums dédiés aux blogs et CMS.

Ce livre s’adresse à toute personne connaissant déjà WordPress et sou-haitant débuter dans la création de nouveaux thèmes ou la personna-lisation de thèmes existants. Il a été rédigé à l’aide de la version 4.7 de WordPress.Dans un premier temps, vous apprendrez à gérer les thèmes pour votre site WordPress : rechercher un thème, installer et activer un thème. Puis, nous aborderons les bases du langage PHP, prérequis nécessaire puisque les thèmes sont créés avec les trois langages « fondamentaux » du Web : HTML, CSS et PHP. La connaissance de l’HTML et des CSS est donc recommandée.Nous verrons ensuite comment sont structurés les thèmes WordPress et quels sont les fichiers qui les composent. Nous apprendrons à utili-ser la hiérarchie des templates (les modèles de page) pour connaître les fichiers qui sont utilisés pour tous les types d’affichage : la page d’accueil, les articles, les pages, les archives...Un chapitre est entièrement consacré à l’étude des principaux mar-queurs de modèles (template tags) qui vont chercher les informations, les données et les contenus pour permettre leur affichage dans les templates.Puis nous analyserons dans le détail le thème proposé par défaut dans WordPress 4.7, Twenty Seventeen, afin de bien comprendre son fonc-tionnement, sa structure et son architecture. Vous pourrez ainsi l’utiliser comme thème parent pour créer des thèmes enfants.Actuellement la conception de thème WordPress passe principalement par l’utilisation de thème de démarrage (starter theme). Ces thèmes de démarrage vous proposent une architecture et une structure de fi-chiers de base ; à l’aide de la hiérarchie des fichiers et des marqueurs de modèles, vous pourrez ainsi concevoir vos propres thèmes rapidement. Nous étudierons les thèmes de démarrage JointsWP et Underscores à partir duquel nous concevrons un thème personnalisé.Nous terminerons par la personnalisation des thèmes avec l’interface standard de WordPress, l’API Customizer. Ainsi, les utilisateurs seront à même de pouvoir modifier eux-mêmes certaines options du thème que vous proposerez ; le dernier chapitre est consacré à la conception des thèmes enfants.

Christophe AUBRY

Téléchargementwww.editions-eni.fr.fr

sur www.editions-eni.fr : b fichiers des thèmes

utilisés dans le livre

3e édition

Nouvelle édition

Pour plus d’informations :

Christophe AUBRY

© E

ditio

ns E

NI -

All

right

s res

erve

d
Table des matières 1. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Avant-propos

Chapitre 1 : Gérer les thèmesA. Les objectifs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14B. Utiliser les thèmes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 14C. Choisir un thème depuis le site officiel . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 16

1. Rechercher un thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 162. Choisir un thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 173. Télécharger un thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 194. Installer un thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 205. Activer un thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 226. Gérer les thèmes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 25

D. Choisir un thème depuis l’administration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 261. Rechercher un thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 26

E. Le thème Twenty Seventeen . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 291. Le thème par défaut . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 292. Personnalisation du titre et du slogan . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 313. Personnalisation des couleurs. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 334. Personnalisation des images de l'en-tête . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 355. Personnalisation des menus, des widgets et de la page d'accueil . . . . . . . . . . . . . . . . . . . . . . 366. Les options du thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 377. Ajouter des règles CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 38

Chapitre 2 : Des notions sur PHPA. L’objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40B. HTML et XHTML. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 40C. Les extensions des fichiers dynamiques. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41D. Insérer du code PHP. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 41

1. Les balises d’insertion. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 412. L’insertion dans l’HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42

E. Afficher du contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 421. Afficher du texte. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 422. Insérer de l’HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 42

F. Le code généré . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 431. Les pages dynamiques. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 432. Ajouter les éléments HTML de structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 43

G. Les commentaires. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 441. Utiliser les commentaires . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 442. Les commentaires sur une seule ligne . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 443. Les commentaires sur plusieurs lignes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 44

WordPress : Conception et personnalisation des thèmes2 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

4. Les commentaires HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45H. Les variables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 45

1. Utiliser les variables. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 452. Les différents types de variable. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 453. Définir une variable de texte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 464. Définir une variable numérique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 465. Définir une variable booléenne . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 476. Afficher une variable. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 477. La concaténation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 488. Les calculs arithmétiques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 48

I. Les tableaux . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 491. Utiliser les tableaux . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 492. Les tableaux numérotés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 493. Afficher une valeur d’un tableau numéroté . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 504. Les tableaux associatifs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 505. Afficher une valeur d’un tableau associatif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 51

J. Les constantes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 511. Utiliser les constantes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 512. Définir une constante . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 513. Afficher une constante. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 514. Utiliser une constante. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52

K. Les conditions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 521. Utiliser les conditions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52
2. Définir un test sur une condition . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 523. Les opérateurs dans les conditions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 534. Les tests multiples . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 535. Le test sur les booléens . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 546. Les conditions avec incorporation de HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 557. Les conditions multiples . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 558. Les nombreuses conditions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 56
L. La boucle Tant que. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 571. Utiliser la boucle Tant que . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 572. Créer une boucle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 573. L’exécution de la boucle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 57

M. La boucle Pour . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 581. Utiliser la boucle Pour. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 582. Créer une boucle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 583. L’exécution de la boucle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59

N. Le choix d’une boucle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 59

© E

ditio

ns E

NI -

All

right

s res

erve

d
O. Les fonctions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 591. Utiliser les fonctions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 592. Des fonctions existantes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 593. Créer une fonction. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 604. La portée des variables dans les fonctions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 615. Les variables globales. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 62

P. Des fonctions utiles sur les variables . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 631. Tester si une variable est définie. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 632. Tester si une variable est vide . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 64

Q. Insertion de fichiers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 651. Objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 652. Les différentes parties d’une page. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 653. Le fichier d’en-tête. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 654. Le fichier de la zone centrale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 665. Le fichier du pied de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 666. Le fichier maître . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 667. Simplifier la structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 67

Chapitre 3 : La structure des thèmesA. L’objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70B. Les fichiers des thèmes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70

1. Les fichiers obligatoires . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 702. Le fichier de personnalisation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 70
3. Les fichiers de structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 704. L’appel des fichiers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 725. Le code et l'affichage généré . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 746. La place des éléments HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 767. L'appel aux templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 768. L'appel aux formats d'article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 77
Chapitre 4 : La hiérarchie des templatesA. L'objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 80B. La hiérarchie des templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 80C. Les templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82

1. Les templates de variable . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 822. Les templates secondaires . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 823. Les templates primaires. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 834. Le template obligatoire . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 83


D. Les pages d'accueil. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 831. La page d'accueil de type blog . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 832. La page d'accueil de type site classique. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 84

E. Les templates des articles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 841. Les types d'affichage. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 842. Les templates des fichiers joints . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 853. Les templates des contenus personnalisés. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 864. Les templates des articles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 86

F. Les templates des pages . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 861. Les types de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 862. Les modèles de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 873. Les templates spécifiques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 884. Les templates standards . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 88

G. Les templates des archives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 881. Les types de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 892. Les templates des archives des auteurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 893. Les templates des archives des catégories . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 904. Les templates des archives des types de contenu personnalisé . . . . . . . . . . . . . . . . . . . . . . . . 915. Les templates de la taxinomie des types de contenu personnalisé . . . . . . . . . . . . . . . . . . . . . 916. Les templates des archives calendaires . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 927. Les templates des mots-clés . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 92

H. Les autres templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 93

Chapitre 5 : Les principaux marqueurs et fonctions WordPressA. Les marqueurs et les fonctions . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96B. La boucle WordPress . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 96C. Créer de nouvelles boucles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 98

1. Les objectifs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 982. Créer une boucle sur une catégorie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 983. Créer une boucle sur un mois . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1004. Créer une boucle sur un auteur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1015. Créer une boucle multicritère . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1026. Créer une boucle sur un type de contenu. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .102

D. Les inclusions des fichiers et des templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1021. Insérer les fichiers de structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1022. Insérer les templates. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1033. L'appel aux formats d'article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .103

E. Les marqueurs de site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .104F. Les injections de code. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .105

© E

ditio

ns E

NI -

All

right

s res

erve

d
G. Les fonctions pour les liens . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1061. Les liens dans WordPress . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1062. Le lien vers la page d'accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1063. Les URL du site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1064. Le lien vers un contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1075. L'URL d'un contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1076. Le lien d'édition . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1087. Le lien vers l'administration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .109

H. Les marqueurs des contenus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1091. Afficher le titre. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1092. Afficher le contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1103. Afficher l'extrait. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .111

I. Les marqueurs de date et d'heure de rédaction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1131. Afficher la date de création . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1132. Les paramètres d'affichage de la date . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1133. Afficher des dates de création similaires . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1144. Afficher la date de modification . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1155. Afficher l'heure de création . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1166. Afficher l'heure de modification . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .117

J. Les marqueurs des auteurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1171. Afficher le nom de l'auteur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1172. Afficher le site de l'auteur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1183. Afficher les renseignements biographiques de l'auteur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .119
4. Afficher les métadonnées de l'auteur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1195. Afficher le nombre d’articles de l’auteur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1206. Afficher la liste des articles de l’auteur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1207. Afficher la liste des auteurs. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .121
K. Les marqueurs des images à la une . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1221. Utiliser les images à la une . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1222. Afficher les images à la une . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1233. Les paramètres d'affichage des images à la une. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1244. Ajouter un lien sur l'image à la une . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .125

L. Les marqueurs des catégories . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1251. Afficher le nom des catégories . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1252. Les paramètres d'affichage. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1263. Afficher le nom de la catégorie en archive . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1284. Afficher la description de la catégorie . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .129

M. Les marqueurs des étiquettes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1301. Afficher les étiquettes. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1302. Afficher le nom de l'étiquette en archive. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1313. Afficher la description de l'étiquette. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .131


N. Les marqueurs conditionnels . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1321. Les objectifs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1322. Les articles mis en avant . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1333. Les archives des auteurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1344. Afficher un widget sur la page d'accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .135

O. Créer un emplacement pour des widgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1381. Utiliser les widgets. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1382. Déclarer les emplacements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1383. L'affichage dans l'administration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1414. Afficher l'emplacement dans le thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .142

P. Créer un emplacement pour un menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1431. Utiliser les menus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1432. Déclarer les emplacements . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1443. L'affichage dans l'administration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1444. Afficher l'emplacement dans le thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .146

Chapitre 6 : Le thème Twenty SeventeenA. Les objectifs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .150B. Les fichiers du thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .150C. La structure du thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .152

1. La structure générale . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1522. La structure des templates . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .155

D. Le fichier header.php. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .157
1. Le fichier de structure. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1572. La structure HTML d'en-tête. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1573. Le corps de la page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1584. Le lien pour l'accessibilité . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1595. L'affichage de l'image d'arrière-plan . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1596. L'affichage du logo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1617. L'affichage du titre et du slogan . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1628. L'affichage de la flèche de navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1649. L'affichage de la barre de navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .16510. L'affichage des images à la une. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .16811. L'ouverture des boîtes <div>. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .169
E. Le fichier footer.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1701. Le fichier de structure. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1702. La structure HTML du pied de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1713. L'affichage des widgets . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1724. L'affichage du menu de navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1735. L'affichage des informations du pied de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .173

F. Le fichier sidebar.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .174

© E

ditio

ns E

NI -

All

right

s res

erve

d
G. Le choix de la page d'accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .175H. Le fichier index.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .176

1. Le fichier de structure. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1762. Les fichiers inclus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1763. L'affichage du titre de la page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1774. La boucle WordPress. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1785. La pagination des articles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1786. L'affichage sans contenu à afficher . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .178

I. Le fichier front-page.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1791. Le fichier de structure. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1792. Les options du thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1803. La structure du fichier. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1834. Déterminer la page d'accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1835. L'affichage conditionnel des sections. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1846. L'affichage de la page d'accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1847. L'affichage des sections . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .186

J. Le fichier single.php. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1871. Le fichier de structure. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1872. Les fichiers inclus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1883. L'affichage du contenu de l'article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1884. L'affichage des commentaires. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1885. L'affichage de la navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .190

K. Le fichier page.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .190
L. Le fichier archive.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .191
1. Le fichier de structure. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1912. Les fichiers inclus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1923. L'affichage du type d'archive . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1924. L'affichage des articles . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .193

M. Le fichier search.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1931. Le fichier de structure. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1932. Les fichiers inclus . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1943. L'affichage du titre. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1954. L'affichage du contenu de la recherche. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .195

N. Le fichier 404.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .195O. Les template-parts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .196P. Le template-part content.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .198

1. L'utilisation de content.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1982. La structure de l'article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1983. L'affichage des articles mis en avant . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1984. L'affichage de l'en-tête de l'article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .1995. L'affichage du titre de l'article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .200


6. L'affichage du contenu de l'article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2017. L'affichage du pied de page de l'article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .202

Q. Les template-parts de format . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .202R. Le template-part content-excerpt.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .204S. Le template-part content-none.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .205T. Le template-part content-page.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .207

Chapitre 7 : Le thème de démarrage UnderscoresA. L'objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .210B. L'installation d’Underscores standard . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .210

1. Télécharger le Starter Theme. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2102. Installer votre thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .211

C. L'installation d’Underscores avec les options . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2121. Télécharger le Starter Theme. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2122. Installer votre thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .214

D. Les fichiers du thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .215E. La feuille de styles CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .216F. Les fonctions personnalisées du thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .217G. La traduction du thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .218H. La structure du thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .219I. Le fichier header.php. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .221

1. L'en-tête HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2212. L'affichage du titre et du slogan . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .221
3. La barre de navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2234. L'ouverture du contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .224
J. Le fichier sidebar.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .224K. Le fichier footer.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .226

1. La structure du pied de page. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2262. La fermeture du contenu principal . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2273. Le pied de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2274. La fermeture des éléments de structure . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .227

L. La page d'accueil. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2281. La structure de la page d'accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2282. Les deux types de pages d'accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2283. La page d'accueil en blog . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2304. La page d'accueil statique. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2325. L'affichage du blog avec une page d'accueil statique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .233

M. Le fichier single.php. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .234N. Le fichier page.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .236O. Le fichier archive.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .238P. Le fichier search.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .240

© E

ditio

ns E

NI -

All

right

s res

erve

d
Q. Les template-parts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2421. L'utilisation des template-parts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2422. Le fichier content.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2433. Le fichier content-page.php. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2454. Le fichier content-search.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2475. Le fichier content-none.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .248

R. Le fichier 404.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .249

Chapitre 8 : Créer un thème avec UnderscoresA. Les objectifs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .254B. L'installation d’Underscores . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .254C. Installer une grille de mise en page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .255

1. La grille Grillade . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2552. Ajouter la feuille de style grillade.css . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2553. La structure du thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2564. La grille d'affichage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2575. Des styles CSS pour la grille . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .258

D. Les paramètres du site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .262E. Ajouter une Google Font . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .264F. Personnaliser l'en-tête du site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .266

1. La structure de l'en-tête. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2662. Personnaliser les couleurs de l'en-tête . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2673. Personnaliser l'image d'arrière-plan de l'en-tête . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .268

G. Personnaliser le menu de navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2711. Le menu de navigation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2712. Le menu responsive . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .274

H. La navigation dans la page d'accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .276I. Personnaliser les images à la une . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .278

1. Utiliser les images à la une . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2782. Paramétrer l'affichage des images à la une. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2783. Afficher les images à la une . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .280

J. Personnaliser les extraits . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2831. Utiliser les extraits . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2832. Afficher les extraits . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .283

K. Personnaliser les articles en page seule . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2851. Le template-part content.php. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2852. L'affichage du titre de l'article . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2853. L'affichage des métadonnées . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2854. L'affichage du contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2865. L'affichage de la taxinomie. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .286

L. Personnaliser les pages statiques . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .289


M. Personnaliser les archives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2891. Utiliser les archives . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2892. L'affichage du titre et de la description de l'archive . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2893. L'affichage du contenu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2894. L'affichage des informations des auteurs . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .290

N. Personnaliser la sidebar . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2921. Utiliser l'emplacement . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .2922. Personnaliser la mise en forme . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .293

O. Personnaliser le pied de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .294

Chapitre 9 : Le thème de démarrage JointsWPA. L'objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .296B. L'installation de JointsWP . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .296C. Les fichiers du thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .297D. La feuille de style CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .299E. Personnaliser l'interface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .300

1. Personnaliser la connexion. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3002. Personnaliser l'administration . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .302

F. La traduction du thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .303G. La structure du thème. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .303

1. La structure des fichiers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3032. La structure des éléments . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3053. La mise en page de Foundation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .307

H. Le fichier header.php. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3101. L'en-tête HTML . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3102. L'affichage de l'en-tête. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3103. L'affichage du titre du site. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3114. L'affichage du menu sur grand écran . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3115. L'affichage du menu sur petit écran . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .312

I. Le fichier sidebar.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .313J. Le fichier footer.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .315

1. La structure du pied de page. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3152. L'affichage du menu . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3163. L'affichage du texte. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .316

K. La page d'accueil. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3171. Les deux types de pages d'accueil . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3172. La page d'accueil en blog . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3173. La page d'accueil en page statique . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .318

L. Le fichier single.php. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .319M. Le fichier page.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .319N. Le fichier archive.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .320

© E

ditio

ns E

NI -

All

right

s res

erve

d
O. Le fichier search.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .321P. Les template-parts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .322

1. L'utilisation des template-parts . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3222. Le fichier loop-archive.php. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3233. Le fichier loop-page.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3244. Le fichier loop-single.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3255. Le fichier content-missing.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .327

Q. Le fichier 404.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .329

Chapitre 10 : La personnalisation des thèmesA. L'objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .332B. La personnalisation par défaut . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .333C. Créer une personnalisation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .334D. Personnaliser une couleur . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .335

1. L'objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3352. Créer la personnalisation. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3353. Ajouter une section. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3364. Ajouter un réglage. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3375. Ajouter un contrôle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3376. Le code complet. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3387. Appliquer la personnalisation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3408. L'aperçu en direct . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3419. Appliquer la couleur au thème . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .342

E. Personnaliser un texte. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3431. L'objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3432. La section . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3433. Ajouter le réglage . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3434. Ajouter le contrôle. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3445. Le code pour le champ de texte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3446. L'affichage dans le pied de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3447. L'affichage de la personnalisation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .345

F. Personnaliser l'affichage du texte . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3461. L'objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3462. Ajouter le réglage et le contrôle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3473. L'affichage dans le pied de page . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3474. L'affichage de la personnalisation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .348

G. Personnaliser l'alignement du titre du site . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3501. L'objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3502. Ajouter le réglage et le contrôle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3503. L'affichage dans l'en-tête . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3514. L'affichage de la personnalisation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .351


H. Personnaliser l'image d'arrière-plan de l'en-tête . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3531. L'objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3532. Ajouter le réglage et le contrôle . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3533. L'affichage en arrière-plan de l'en-tête. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3544. L'affichage de la personnalisation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .355

Chapitre 11 : Les thèmes enfantsA. L’objectif . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .360B. Le dossier du thème enfant. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .360C. La vignette du thème enfant . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .360D. La feuille de style du thème enfant . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .361

1. Le fichier CSS . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3612. Importer les styles parents . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3623. Créer des styles enfants . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .363

E. Les autres fichiers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .363F. Le fichier functions.php . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .364

1. L’ouverture des fichiers . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .3642. Ajouter une fonction. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .364

G. Installer le thème enfant . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .365

Index . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .369


Chapit re 5 : Les princ ipaux marqueurs et fonctions W ordPress

WordPress : Conception et perso nnal isat ion des thèmesA. Les marqueurs et les fonctionsPour afficher les contenus de votre site WordPress, les templates utilisent des marqueurs demodèle, des template tags en anglais. Les marqueurs sont des fonctions PHP spécialementdédiées à WordPress. Elles vont chercher des informations dans la base de données pour per-mettre l'affichage de leurs valeurs dans les templates.

Par exemple, le marqueur bloginfo('url') permet d'afficher l'URL de votre site. Le codepourrait être celui-ci : <p><?php bloginfo('url'); ?></p>. Le template va afficher dansun paragraphe <p>, l'URL de votre site.

Les fonctions de référence de WordPress (functions reference en anglais) sont très similaires auxmarqueurs. Contrairement aux marqueurs, les fonctions n'affichent rien, elles renvoient desvaleurs que vous pouvez stocker dans des variables PHP. Ensuite, vous pouvez effectuer un trai-tement sur ces variables.

Par exemple, la fonction get_bloginfo('template_url') va renvoyer le chemin d'accèsau thème actif. Cet exemple va permettre de stocker le chemin d'accès du thème actif dans unevariable nommée $chemin_theme. Ensuite, nous allons afficher la valeur de cette variable dansun paragraphe <p> à l’aide de la fonction PHP echo() :

<?php $chemin_theme = get_bloginfo('template_url'); echo('<p>Le chemin d\'accès au thème est : '.$chemin_theme.'</p>');?>

Les marqueurs sont principalement destinés à la création des thèmes et les fonctions sont princi-palement destinées à la création de plug-ins et d'applications personnalisées. Et vous trouverezbien sûr des marqueurs et des fonctions dans les thèmes ! Enfin, notez que les marqueurs sontdes fonctions de référence.

Vous trouverez toute la documentation technique sur les marqueurs et les fonctions à cette URL :https://codex.wordpress.org.

Dans ce chapitre, nous n'allons bien sûr pas étudier tous les marqueurs, il faudrait plusieursouvrages pour le faire, mais les principaux. Ces marqueurs vous permettront d'afficher les princi-paux contenus de vos sites web WordPress.

B. La boucle WordPressDans les thèmes, vous trouverez dans de très nombreux fichiers la "fameuse" boucle WordPress(loop en anglais) qui est le cœur de l'affichage des sites WordPress. C'est par cette bouclewhile() que sont affichés les contenus rédactionnels dans toutes les pages de vos sites Wor-dPress.

La boucle va interroger la base de données pour savoir s’il y a des données à afficher. Si la réponseest oui, la boucle va afficher les données que nous lui demandons d'afficher.

© E

ditio

ns E

NI -

All

right

s res

erve

d
Chapitre 5 : Les principaux marqueurs et fonctions WordPress 97. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Voici la boucle standard simplifiée (sans les commentaires et sans les arguments de la fonctionthe_posts_pagination()) du thème par défaut de WordPress 4.7, le thème TwentySeventeen :

<?php if ( have_posts() ) :

while ( have_posts() ) : the_post(); get_template_part( 'template-parts/post/content',

get_post_format() ); endwhile; the_posts_pagination(...);

else : get_template_part( 'template-parts/post/content', 'none' );

endif; ?>

La première étape consiste à tester avec la fonction PHP if(), s’il y a du contenu disponible avecla fonction WordPress have_posts(). Voici l'URL de référence de cette fonction : https://developer.wordpress.org/reference/functions/have_posts/

S’il y a du contenu à afficher, la boucle PHP while() est appelée. Tant qu'il y a du contenu à affi-cher, have_posts(), la boucle utilise la fonction WordPress the_post() qui permet une ité-ration sur le contenu. Voici l'URL de référence de cette fonction : https://developer.wordpress.org/reference/functions/the_post/

Ensuite, la boucle va chercher le bon template à utiliser pour afficher les informations. Pour utili-ser le bon template, c'est la fonction WordPress get_template_part() qui est utilisée. Voici
l'URL de référence de cette fonction : https://developer.wordpress.org/reference/functions/get_template_part/. Le premier argument de cette fonction est le chemin d'accès aux templates :template-parts/post/content. Le deuxième argument détermine s’il faut utiliser un for-mat d'article spécifié, avec la fonction WordPress get_post_format(). Voici l'URL de réfé-rence de cette fonction : https://developer.wordpress.org/reference/functions/get_post_format/
Puis la boucle s'arrête : endwhile;.

Ensuite, WordPress affiche, si c'est nécessaire, la pagination des articles dans la page, avec la fonc-tion the_posts_pagination(). Voici l'URL de référence de cette fonction : https://developer.wordpress.org/reference/functions/the_posts_pagination/

Ceci termine la partie du code qui affiche le contenu, s’il y a du contenu à afficher. C'est la pre-mière partie de la fonction if( have_posts() ).

Ensuite, nous avons else : qui indique ce qu'il faut faire s’il n'y a pas de contenu à afficher. Dansce cas, WordPress utilise un template spécifique, nommé content-none.php pour indiquer qu'iln'y a pas de contenu à afficher. C'est à nouveau la fonction WordPress get_template_part()qui est utilisée.

Puis pour terminer, nous avons la fin du test avec endif;.


C. Créer de nouvelles boucles

1. Les objectifsNous venons de le voir, la boucle standard de WordPress permet d'afficher les contenus danstoutes les pages de votre site. Dans la page d'accueil, la boucle permet d'afficher la liste des X der-niers articles créés, avec une configuration standard de type blog (menu Réglages - Lecture -options La page d’accueil affiche et Les pages du site doivent afficher au plus).

Mais pour personnaliser l'affichage en page d'accueil, vous pouvez souhaiter afficher en plusd'autres contenus selon d'autres critères. Par exemple, vous souhaiteriez afficher les X derniersarticles d'une catégorie donnée, ou d'un auteur précis, ou d'un mois spécifié. Vous pouvez aussivouloir afficher les articles d'un type de contenu personnalisé (Custom Post Type).

Si tel est votre objectif, vous devez alors créer une deuxième boucle WordPress à l'aide de la fonc-tion WP_Query(), dont voici l'URL de référence sur le Codex de WordPress : https://codex.wordpress.org/Class_Reference/WP_Query.

2. Créer une boucle sur une catégoriePour ce premier exemple, nous allons créer une boucle sur une catégorie donnée. La premièreétape consiste à connaître l'identifiant de la catégorie voulue. Pour ce faire vous pouvez utiliserun plug-in comme Catch IDs (https://wordpress.org/plugins/catch-ids/) ou bien repérer cet iden-tifiant au survol de ladite catégorie, dans la barre d'état de l'administration de votre site. Dans cetexemple, l'identifiant de la catégorie ciblée est 2.

Nous allons afficher le résultat de cette nouvelle boucle dans la page d'accueil. C'est donc dans lefichier index.php que nous allons insérer ce code, sous la boucle principale.

La première étape consiste à définir les arguments de la nouvelle requête, avec les critères desélection. Dans cet exemple, les critères seront d'afficher les contenus de type Article de la caté-gorie Voyage dont l'identifiant est 2 et d'afficher les 10 derniers. Voici la déclaration de cetterequête :

// Définition des arguments de la requête $args_voyage=array( 'post_type' => 'post', 'cat' => 2, 'posts_per_page' => 10,

);

© E

ditio

ns E

NI -

All

right

s res

erve

d
Détaillons cette déclaration :- $args_voyage : nous créons une variable pour stocker les arguments.- array(...) : cette variable stocke les arguments dans un tableau.- 'post_type' => 'post' : le type de contenu recherché est Article.- 'cat' => 2 : l'identifiant de la catégorie d'article recherché est 2.- 'posts_per_page' => 10 : nous recherchons les 10 derniers articles publiés.

Ensuite, dans la deuxième étape, nous allons définir une nouvelle requête :// Définition de la nouvelle requête $query_voyage = new WP_Query($args_voyage);

- $query_voyage : nous créons une variable pour stocker cette nouvelle requête.- new WP_Query($args_voyage) : nous créons une nouvelle requête, new, avec la fonctionWP_Query(), en lui passant les arguments avec la variable $args_voyage, définie précé-demment.

La troisième étape consiste à créer une boucle WordPress avec cette nouvelle requête ://Exécution de la boucle avec la nouvelle requête if($query_voyage->have_posts()) : while ($query_voyage-> have_posts() ) : $query_voyage->the_post(); the_title('<h4><a href="'.get_permalink().'">','</a></h4>'); endwhile;

endif;

Il n'y a aucune difficulté dans cette boucle. C'est une boucle WordPress classique qui utilise la
nouvelle requête $query_voyage. Nous affichons le titre des articles trouvés, the_title(),avec leur lien, get_permalink(), pour les afficher en page seule.
Pour terminer, la dernière étape permet de réinitialiser la requête principale afin de remettre àzéro le compteur de contenu post :

// Réinitialisation de la requête principale wp_reset_postdata();

Voici l'URL de référence de cette fonction : https://developer.wordpress.org/reference/functions/wp_reset_postdata/

Voici le code complet de cette nouvelle requête :// Définition des arguments de la requête $args_voyage=array( 'post_type' => 'post', 'cat' => 2, 'posts_per_page' => 10,

); // Définition de la nouvelle requête $query_voyage = new WP_Query($args_voyage);


//Exécution de la boucle avec la nouvelle requête if($query_voyage->have_posts()) : while ($query_voyage-> have_posts() ) : $query_voyage->the_post(); the_title('<h4><a href="'.get_permalink().'">','</a></h4>'); endwhile;

endif; // Réinitialisation de la requête principale wp_reset_postdata();

3. Créer une boucle sur un moisDans cet exemple, nous allons afficher les 10 derniers articles du mois d'août.

Voici la déclaration du tableau d'arguments :$args_aout=array( 'post_type' => 'post', 'monthnum' => 8, 'posts_per_page' => 10,

);

Nous utilisons le paramètre monthnum pour définir le numéro du mois d'août : 8.

Ensuite nous définissons la nouvelle requête :$query_aout = new WP_Query($args_aout);

Et vient ensuite la nouvelle boucle :
if($query_aout->have_posts()) : while ($query_aout-> have_posts() ) : $query_aout->the_post(); the_title('<h4><a href="'.get_permalink().'">','</a></h4>'); the_date(); endwhile; endif;
Dans cette boucle, nous affichons le titre des articles avec leur lien et la date de publication,the_date().

Nous terminons par la réinitialisation :wp_reset_postdata();

Voici le code complet de cet exemple :// Définition des arguments de la requête $args_aout=array( 'post_type' => 'post', 'monthnum' => 8, 'posts_per_page' => 10,

);

© E

ditio

ns E

NI -

All

right

s res

erve

d
// Définition de la requête $query_aout = new WP_Query($args_aout); //Exécution de la boucle avec la nouvelle requête if($query_aout->have_posts()) : while ($query_aout-> have_posts() ) : $query_aout->the_post(); the_title('<h4><a href="'.get_permalink().'">','</a></h4>'); the_date();

endwhile; endif; // Réinitialisation de la requête principale wp_reset_postdata();

4. Créer une boucle sur un auteurVous pouvez aussi afficher tous les articles d'un auteur donné. Comme pour les catégories, il fautconnaître l'identifiant de l'auteur concerné. Dans cet exemple, l'identifiant est 2.

Voici immédiatement le code complet de cet exemple qui utilise le paramètre 'author' => 2pour identifier l'auteur :

// Définition des arguments de la requête $args_christine=array( 'post_type' => 'post', 'author' => 2, 'posts_per_page' => 10,
); // Définition de la requête $query_christine = new WP_Query($args_christine); // Exécution de la boucle avec la nouvelle requête if($query_christine->have_posts()) : while ($query_christine-> have_posts() ) : $query_christine->the_post(); the_title('<h4><a href="'.get_permalink().'">','</a></h4>');endwhile; endif; // Réinitialisation de la requête principale wp_reset_postdata(); // Affichage de l'URL de sa page d'auteur $url_auteur = get_author_posts_url(2); echo ('<p>URL de la page de l\'auteur : <a href="'.$url_auteur.'"> '.get_the_author_meta('first_name',2).'</a>.</p>');


5. Créer une boucle multicritèreDans la déclaration du tableau des arguments de la requête, vous pouvez indiquer tous les cri-tères de recherche que vous voulez. Vous pouvez spécifier des critères sur les auteurs, les catégo-ries, les étiquettes, les types de contenu (article ou page), les droits des utilisateurs, les dates depublication, les statuts des publication... Reportez-vous à la page du Codex pour visualiser tousces critères : https://codex.wordpress.org/Class_Reference/WP_Query

Voici un exemple d'un tableau d'arguments portant sur le type de contenu, la catégorie, l'auteuret la date de publication :

$args = array( 'post_type' => 'post', 'cat' => 6, 'author' => 2, 'monthnum' => 5, 'posts_per_page' => 10,

);

6. Créer une boucle sur un type de contenuVous le savez, WordPress ne propose de manière standard que deux types de contenu : les articleset les pages. À l'aide d'un plug-in ou directement en mode code dans le fichier functions.php,vous pouvez créer d'autres types de contenu (Custom Post Type) et leur taxinomie associée.

Dans cet exemple, le nouveau type de contenu est nommé livre.

Voici la déclaration des arguments :$args_livre=array( 'post_type' => 'livre', 'posts_per_page' => 5,

);

C'est avec le paramètre post_type que nous spécifions quel est le type de contenu sur lequelnous recherchons des contenus. Dans cet exemple, c'est livre.

D. Les inclusions des fichiers et des templates

1. Insérer les fichiers de structureNous l'avons déjà évoqué, les thèmes WordPress sont constitués de plusieurs fichiers de structurequ'il faut associer afin de constituer l'affichage complet des pages.

De manière usuelle nous avons quatre fichiers de structure :- la page principale : index.php qui est le fichier maître, celui qui assemble l'ensemble des autres

fichiers, des autres templates.

e édition - conception et personnalisation des thèmes wordpress · 2017-04-14 · forums dédiés...

Documents