WordPress : conception et personnalisation des thèmes

Auteur(s) :

Aubry, Christophe (1963-....) Découvrir l'auteur

Résumé

Rédigé à partir de la version 5.3 de WordPress, un guide consacré à la création, la personnalisation et l'organisation de thèmes nouveaux ou existants. L'auteur reprend aussi les bases du langage PHP puis il étudie en détail le fonctionnement et la structure du thème par défaut de la plate-forme. Avec un QR code pour accéder aux fichiers complémentaires. ©Electre 2020

Éditeur(s)
- Éditions ENI
Date
- cop. 2020
Notes
- La couv. porte en plus : "En téléchargement : exemples de thèmes"
- La 4e de couv. porte en plus : "Sur www.editions-eni.fr : fichiers des thèmes utilisés dans le livre"
- Contient un "flshcode" permettant d'accéder à un contenu via Internet
Langues
- Français
Description matérielle
- 1 vol. (374 p.) : ill. ; 21 cm
Collections
- Objectif web
Sujet(s)
ISBN
- 978-2-409-02386-6
Indice
- 681.511 Logiciels de développement de sites web
Quatrième de couverture
- WordPress
  Conception et personnalisation des thèmes
  Ce livre s'adresse à toute personne connaissant déjà WordPress et souhaitant débuter dans la création de nouveaux thèmes ou la personnalisation de thèmes existants. Il a été rédigé à l'aide de la version 5.3 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 à utiliser 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 marqueurs 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 5.3, Twenty Twenty, afin de bien comprendre son fonctionnement, 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 fichiers 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 Underscores et JointsWP à 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.
Tables des matières
- - WordPress
  - Conception et personnalisation des thèmes
  - 4e édition
  - Editions ENI
  - Avant-propos
  - Chapitre 1 : Gérer les thèmes
  - A. Les objectifs14
  - B. Utiliser les thèmes14
  - C. Choisir un thème depuis le site officiel16
  - 1. Rechercher un thème16
  - 2. Choisir un thème17
  - 3. Télécharger un thème19
  - 4. Installer un thème20
  - 5. Activer un thème22
  - 6. Gérer les thèmes24
  - D. Choisir un thème depuis l'administration26
  - 1. Rechercher un thème26
  - E. Le thème Twenty Twenty29
  - 1. Le thème par défaut29
  - 2. Personnalisation du titre et du slogan32
  - 3. Personnalisation des couleurs35
  - 4. Personnalisation des options du thème36
  - 5. Personnaliser le modèle de page avec bannière37
  - 6. Personnaliser l'arrière-plan39
  - 7. Personnaliser les menus, les widgets et la page d'accueil40
  - Chapitre 2 : Des notions sur PHP
  - A. L'objectif42
  - B. HTML et XHTML42
  - C. Les extensions des fichiers dynamiques43
  - D. Insérer du code PHP43
  - 1. Les balises d'insertion43
  - 2. L'insertion dans l'HTML44
  - E. Afficher du contenu44
  - 1. Afficher du texte44
  - 2. Insérer de l'HTML44
  - F. Le code généré45
  - 1. Les pages dynamiques45
  - 2. Ajouter les éléments HTML de structure45
  - G. Les commentaires46
  - 1. Utiliser les commentaires46
  - 2. Les commentaires sur une seule ligne46
  - 3. Les commentaires sur plusieurs lignes46
  - 4. Les commentaires HTML47
  - H. Les variables47
  - 1. Utiliser les variables47
  - 2. Les différents types de variable47
  - 3. Définir une variable de texte48
  - 4. Définir une variable numérique48
  - 5. Définir une variable booléenne49
  - 6. Afficher une variable49
  - 7. La concaténation50
  - 8. Les calculs arithmétiques50
  - I. Les tableaux51
  - 1. Utiliser les tableaux51
  - 2. Les tableaux numérotés51
  - 3. Afficher une valeur d'un tableau numéroté52
  - 4. Les tableaux associatifs52
  - 5. Afficher une valeur d'un tableau associatif53
  - J. Les constantes53
  - 1. Utiliser les constantes53
  - 2. Définir une constante53
  - 3. Afficher une constante53
  - 4. Utiliser une constante54
  - K. Les conditions54
  - 1. Utiliser les conditions54
  - 2. Définir un test sur une condition54
  - 3. Les opérateurs dans les conditions55
  - 4. Les tests multiples55
  - 5. Le test sur les booléens56
  - 6. Les conditions avec incorporation de HTML57
  - 7. Les conditions multiples57
  - 8. Les nombreuses conditions58
  - L. La boucle Tant que59
  - 1. Utiliser la boucle Tant que59
  - 2. Créer une boucle59
  - 3. L'exécution de la boucle59
  - M. La boucle Pour60
  - 1. Utiliser la boucle Pour60
  - 2. Créer une boucle60
  - 3. L'exécution de la boucle61
  - N. Le choix d'une boucle61
  - O. Les fonctions61
  - 1. Utiliser les fonctions61
  - 2. Des fonctions existantes61
  - 3. Créer une fonction62
  - 4. La portée des variables dans les fonctions63
  - 5. Les variables globales64
  - P. Des fonctions utiles sur les variables65
  - 1. Tester si une variable est définie65
  - 2. Tester si une variable est vide66
  - Q. Insertion de fichiers67
  - 1. Objectif67
  - 2. Les différentes parties d'une page67
  - 3. Le fichier d'en-tête67
  - 4. Le fichier de la zone centrale68
  - 5. Le fichier du pied de page68
  - 6. Le fichier maître68
  - 7. Simplifier la structure69
  - Chapitre 3 : La structure des thèmes
  - A. L'objectif72
  - B. Les fichiers des thèmes72
  - 1. Les fichiers obligatoires72
  - 2. Le fichier de personnalisation72
  - 3. Les fichiers de structure73
  - 4. La structure du thème Twenty Twenty74
  - 5. L'appel des fichiers et des fonctions74
  - 6. Le code et l'affichage généré76
  - 7. La place des éléments HTML80
  - 8. L'appel aux templates80
  - 9. L'appel aux formats d'article81
  - Chapitre 4 : La hiérarchie des templates
  - A. L'objectif84
  - B. La hiérarchie des templates84
  - C. Les templates86
  - 1. Les templates de variable86
  - 2. Les templates secondaires86
  - 3. Les templates primaires87
  - 4. Le template obligatoire87
  - D. Les pages d'accueil87
  - 1. La page d'accueil de type blog87
  - 2. La page d'accueil de type site classique88
  - E. Les templates des articles88
  - 1. Les types d'affichage88
  - 2. Les templates des fichiers joints89
  - 3. Les templates des contenus personnalisés89
  - 4. Les templates des articles90
  - F. Les templates des pages90
  - 1. Les types de page90
  - 2. Les modèles de page90
  - 3. Les templates spécifiques91
  - 4. Les templates standards91
  - G. Les templates des archives92
  - 1. Les types de page92
  - 2. Les templates des archives des auteurs93
  - 3. Les templates des archives des catégories93
  - 4. Les templates des archives des types de contenu personnalisé94
  - 5. Les templates de la taxinomie des types de contenu personnalisé94
  - 6. Les templates des archives calendaires95
  - 7. Les templates des mots-clés95
  - H. Les autres templates96
  - Chapitre 5 : Les principaux marqueurs et fonctions WordPress
  - A. Les marqueurs et les fonctions98
  - B. La boucle WordPress98
  - C. Créer de nouvelles boucles99
  - 1. Les objectifs99
  - 2. Créer une boucle sur une catégorie100
  - 3. Créer une boucle sur un mois102
  - 4. Créer une boucle sur un auteur103
  - 5. Créer une boucle multicritère103
  - 6. Créer une boucle sur un type de contenu104
  - D. Les inclusions des fichiers et des templates104
  - 1. Insérer les fichiers de structure104
  - 2. Insérer les templates105
  - 3. L'appel aux formats d'article105
  - E. Les marqueurs de site106
  - F. Les injections de code107
  - G. Les fonctions pour les liens107
  - 1. Les liens dans WordPress107
  - 2. Le lien vers la page d'accueil107
  - 3. Les URL du site108
  - 4. Le lien vers un contenu108
  - 5. L'URL d'un contenu109
  - 6. Le lien d'édition109
  - 7. Le lien vers l'administration110
  - H. Les marqueurs des contenus111
  - 1. Afficher le titre111
  - 2. Afficher le contenu111
  - 3. Afficher l'extrait113
  - I. Les marqueurs de date et d'heure de rédaction116
  - 1. Afficher la date de création116
  - 2. Les paramètres d'affichage de la date116
  - 3. Afficher la date de modification117
  - 4. Afficher l'heure de création118
  - 5. Afficher l'heure de modification118
  - J. Les marqueurs des auteurs119
  - 1. Afficher le nom de l'auteur119
  - 2. Afficher le site de l'auteur119
  - 3. Afficher les renseignements biographiques de l'auteur120
  - 4. Afficher les métadonnées de l'auteur121
  - 5. Afficher le nombre d'articles de l'auteur122
  - 6. Afficher la liste des articles de l'auteur122
  - 7. Afficher la liste des auteurs122
  - K. Les marqueurs des images mises en avant124
  - 1. Utiliser les images mises en avant124
  - 2. Afficher les images mises en avant124
  - 3. Les paramètres d'affichage des images mises en avant125
  - 4. Ajouter un lien sur l'image mise en avant127
  - L. Les marqueurs des catégories127
  - 1. Afficher le nom des catégories127
  - 2. Les paramètres d'affichage128
  - 3. Afficher le nom de la catégorie en archive130
  - 4. Afficher la description de la catégorie131
  - M. Les marqueurs des étiquettes132
  - 1. Afficher les étiquettes132
  - 2. Afficher le nom de l'étiquette en archive133
  - 3. Afficher la description de l'étiquette134
  - N. Les marqueurs conditionnels134
  - 1. Les objectifs134
  - 2. Les articles épinglés135
  - 3. Les archives des auteurs137
  - 4. Afficher un widget sur la page d'accueil137
  - O. Créer un emplacement pour des widgets140
  - 1. Utiliser les widgets140
  - 2. Déclarer les emplacements140
  - 3. L'affichage dans l'administration143
  - 4. Afficher l'emplacement dans le thème144
  - P. Créer un emplacement pour un menu146
  - 1. Utiliser les menus146
  - 2. Déclarer les emplacements146
  - 3. L'affichage dans l'administration147
  - 4. Afficher l'emplacement dans le thème148
  - Chapitre 6 : Le thème Twenty Twenty
  - A. Les objectifs152
  - B. Les fichiers du thème152
  - C. La structure du thème153
  - 1. Les fichiers de structure153
  - 2. Les emplacements et l'affichage des menus157
  - 3. Les emplacements et l'affichage des widgets160
  - D. Le fichier maître index.php161
  - 1. La structure générale161
  - 2. La partie centrale des pages162
  - 3. Utiliser la boucle WordPress163
  - 4. Afficher la pagination164
  - E. L'affichage de l'en-tête avec header.php164
  - 1. L'en-tête HTML des pages164
  - 2. Le corps HTML des pages165
  - 3. L'affichage de l'en-tête des pages165
  - 4. Les affichages sur smartphone du titre et du slogan166
  - 5. La barre de navigation et la recherche168
  - F. Afficher le pied de page avec footer.php170
  - G. L'affichage des contenus avec singular.php171
  - H. Les contenus réactionnels avec content.php171
  - 1. La structure générale171
  - 2. L'élément <article>173
  - 3. L'affichage du contenu rédactionnel176
  - 4. Les informations de contenu177
  - I. Le modèle de page avec bannière178
  - 1. Utiliser le modèle avec bannière178
  - 2. Le template template-cover.php178
  - 3. Le template secondaire content-cover.php179
  - J. Les templates secondaires183
  - 1. L'inclusion des templates183
  - 2. La biographique des auteurs183
  - 3. L'en-tête des articles184
  - 4. L'image mise en avant184
  - 5. L'affichage des widgets et des menus de pied de page185
  - 6. La fenêtre modale des menus186
  - 7. La fenêtre modale de recherche187
  - 8. La navigation entre les articles188
  - 9. La pagination dans les contenus189
  - K. Le template de l'erreur 404190
  - L. Le template des commentaires191
  - M. Les fonctions d'affichage du thème193
  - Chapitre 7 : Le thème de démarrage Underscores
  - A. L'objectif196
  - B. L'installation d'Underscores standard196
  - 1. Télécharger le Starter Theme196
  - 2. Installer votre thème197
  - C. L'installation d'Underscores avec les options198
  - 1. Télécharger le Starter Theme198
  - 2. Installer votre thème200
  - D. Les fichiers du thème201
  - E. La feuille de styles CSS202
  - F. Les fonctions personnalisées du thème203
  - G. La traduction du thème204
  - H. La structure du thème206
  - I. Le fichier header.php207
  - 1. L'en-tête HTML207
  - 2. L'affichage du titre et du slogan207
  - 3. La barre de navigation209
  - 4. L'ouverture du contenu212
  - J. Le fichier sidebar.php212
  - K. Le fichier footer.php214
  - 1. La structure du pied de page214
  - 2. La fermeture du contenu principal215
  - 3. Le pied de page215
  - 4. La fermeture des éléments de structure216
  - L. La page d'accueil216
  - 1. La structure de la page d'accueil216
  - 2. Les deux types de pages d'accueil217
  - 3. La page d'accueil en blog220
  - 4. La page d'accueil statique221
  - 5. L'affichage du blog avec une page d'accueil statique222
  - M. Le fichier single.php225
  - N. Le fichier page.php226
  - O. Le fichier archive.php228
  - P. Le fichier search.php231
  - Q. Les template-parts233
  - 1. L'utilisation des template-parts233
  - 2. Le fichier content.php233
  - 3. Le fichier content-page.php236
  - 4. Le fichier content-search.php238
  - 5. Le fichier content-none.php240
  - R. Le fichier 404.php241
  - Chapitre 8 : Créer un thème avec Underscores
  - A. Les objectifs246
  - B. L'installation d'Underscores246
  - C. Concevoir une grille de mise en page247
  - 1. Le module CSS 3 Grid Layout247
  - 2. La structure du thème247
  - 3. Définir la grille248
  - 4. Des styles CSS pour la grille249
  - 5. Affiner les affichages250
  - D. Les paramètres du site252
  - E. Ajouter une Google Font255
  - F. Personnaliser l'en-tête du site257
  - 1. La structure de l'en-tête257
  - 2. Personnaliser les couleurs de l'en-tête257
  - 3. Personnaliser l'image d'arrière-plan de l'en-tête258
  - G. Personnaliser le menu de navigation262
  - 1. Le menu de navigation262
  - 2. Le menu responsive264
  - H. La navigation dans la page d'accueil 266
  - I. Personnaliser les images mises en avant269
  - 1. Utiliser les images mises en avant269
  - 2. Paramétrer l'affichage des images mises en avant270
  - 3. Afficher les images mises en avant271
  - J. Personnaliser les extraits276
  - 1. Utiliser les extraits276
  - 2. Afficher les extraits276
  - K. Personnaliser les articles en page seule277
  - 1. Le template-part content.php277
  - 2. L'affichage du titre de l'article277
  - 3. L'affichage des métadonnées278
  - 4. L'affichage du contenu279
  - 5. L'affichage de la taxinomie279
  - L. Personnaliser les pages statiques281
  - M. Personnaliser les archives281
  - 1. Utiliser les archives281
  - 2. L'affichage du titre et de la description de l'archive281
  - 3. L'affichage du contenu281
  - 4. L'affichage des informations des auteurs282
  - N. Personnaliser la sidebar284
  - 1. Utiliser l'emplacement284
  - 2. Personnaliser la mise en forme285
  - O. Personnaliser le pied de page286
  - Chapitre 9 : Le thème de démarrage JointsWP
  - A. L'objectif288
  - B. L'installation de JointsWP288
  - C. Les fichiers du thème289
  - D. La feuille de style CSS291
  - E. Personnaliser l'interface292
  - 1. Personnaliser la connexion292
  - 2. Personnaliser l'administration294
  - F. La traduction du thème296
  - G. La structure du thème297
  - 1. La structure des fichiers297
  - 2. La structure des éléments298
  - 3. La mise en page de Foundation300
  - H. Le fichier header.php304
  - 1. L'en-tête HTML304
  - 1 2. L'affichage de l'en-tête305
  - 3. L'affichage du titre du site306
  - 4. L'affichage du menu sur grand écran306
  - 5. L'affichage du menu sur petit écran307
  - 6. L'affichage du menu Off Canvas308
  - I. Le fichier sidebar.php310
  - J. Le fichier footer.php312
  - 1. La structure du pied de page312
  - 2. L'affichage du menu313
  - 3. L'affichage du texte313
  - K. La page d'accueil314
  - 1. Les deux types de pages d'accueil314
  - 2. La page d'accueil en blog314
  - 3. La page d'accueil en page statique315
  - L. Le fichier single.php316
  - M. Le fichier page.php316
  - N. Le fichier archive.php317
  - O. Le fichier search.php318
  - P. Les template-parts319
  - 1. L'utilisation des template-parts319
  - 2. Le fichier loop-archive.php320
  - 3. Le fichier loop-page.php321
  - 4. Le fichier loop-single.php322
  - 5. Le fichier content-missing.php324
  - Q. Le fichier 404.php326
  - Chapitre 10 : La personnalisation des thèmes
  - A. L'objectif330
  - B. La personnalisation par défaut331
  - C. Créer une personnalisation332
  - D. Personnaliser une couleur333
  - 1. L'objectif333
  - 2. Créer la personnalisation333
  - 3. Ajouter une section334
  - 4. Ajouter un réglage335
  - 5. Ajouter un contrôle336
  - 6. Le code complet336
  - 7. Appliquer la personnalisation339
  - 8. L'aperçu en direct339
  - 9. Appliquer la couleur au thème340
  - E. Personnaliser un texte341
  - 1. L'objectif341
  - 2. La section341
  - 3. Ajouter le réglage342
  - 4. Ajouter le contrôle342
  - 5. Le code pour le champ de texte343
  - 6. L'affichage dans le pied de page343
  - 7. L'affichage de la personnalisation343
  - F. Personnaliser l'affichage du texte345
  - 1. L'objectif345
  - 2. Ajouter le réglage et le contrôle345
  - 3. L'affichage dans le pied de page346
  - 4. L'affichage de la personnalisation346
  - G. Personnaliser l'alignement du titre du site348
  - 1. L'objectif348
  - 2. Ajouter le réglage et le contrôle348
  - 3. L'affichage dans l'en-tête349
  - 4. L'affichage de la personnalisation350
  - H. Personnaliser l'image d'arrière-plan de l'en-tête352
  - 1. L'objectif352
  - 2. Ajouter le réglage et le contrôle352
  - 3. L'affichage en arrière-plan de l'en-tête353
  - 4. L'affichage de la personnalisation354
  - Chapitre 11 : Les thèmes enfants
  - A. L'objectif358
  - B. Le dossier du thème enfant358
  - C. La vignette du thème enfant358
  - D. La feuille de style du thème enfant359
  - 1. Le fichier CSS359
  - 2. Importer les styles parents360
  - 3. Créer des styles enfants361
  - E. Les autres fichiers361
  - F. Le fichier functions.php362
  - 1. L'ouverture des fichiers362
  - 2. Ajouter une fonction362
  - G. Installer le thème enfant363
  - Index 367
Origine de la notice:
- Electre