Créer un thème dans WordPress (partie 5)

Cette série vous propose d'étudier la création d'un thème WordPress "from scratch", c'est à dire en partant de zéro et dans les règles de l'art.

Dans cette cinquième partie (durée plus de 3H) de notre tutoriel, nous allons nous pencher sur la gestion et l'utilisation des images dans WordPress.
Aujourd'hui, il est impossible de concevoir un site web sans qu'il soit largement illustré d'images et paradoxalement, les principes qui doivent guider l'utilisation des images dans WordPress sont peu documentés et la quasi majorité des tutoriels existants ignorent toutes les subtilités mises à notre disposition grâce aux fonctionnalités proposées par WordPress dans ce domaine.

Dans ce tutoriel nous allons aller au fond des choses en suivant les étapes suivantes:
-description de ce qu'il se passe lorsque nous téléversons une image dans WordPress (dossiers de stockage, création de versions d'images réduites)
-visite complète de la bibliothèque de Médias avec la description (et mise en avant des différences) entre le mode d'affichage "liste" et le mode "grille", introduit plus récemment.
-création d'un template (sélectionné dans la hiérarchie de WordPress) afin d'afficher toutes les caractéristiques et versions de nos images téléversées. Nous restreindrons une partie du contenu de cette page aux seuls utilisateurs connectés.
-insertion d'images à l'intérieur des articles, explication des paramètres.
-résolution d'un problème lié au comportement naturel de WordPress lorsque nous utilisons la légende avec une image à l'intérieur d'un article. En effet WordPress assigne un conteneur de taille fixe lorsqu'une légende est utilisée, ce qui est contraire aux principes du Responsive Design.
-en vidéo bonus: insertion de galeries d'images à l'interieur des articles ou pages de WordPress

Les 10 vidéos (+ l'intro) sont disponibles ci-dessous dans une playlist de ma chaine Youtube (réglez le lecteur sur 720p^HD).

sommaire des vidéos:

• intro: présentation du tutoriel
• 01: Étape préliminaire: ajustements sur le thème et création des pages manquantes
• 02: Présentation de la bibliothèque de Médias de WordPress, téléversement d'une image, notion de parentage image/article
• 03: Comparaison des deux modes d'affichage de la bibliothèque de médias de WordPress (liste et grille)
• 04: Création du template image.php pour afficher tous les détails et métadonnées liés aux images
• 05: Création image.php (suite): affichage des versions de l'image, filtrage de l'affichage selon l'utilisateur
• 06: Création image.php (fin): affichage des versions d'images sauvegardées après recadrage et/ou redimensionnement
• 07: Manipulations sur les images: réduction de taille, recadrage
• 08: Insertion d'images dans les articles/pages, refactoring du code lié aux contraintes du Responsive Design
• 09: Insertion d'images (suite et fin): contrôle de la largeur de l'image, insertion de vignettes dans les articles/pages
• 10: (vidéo bonus): Insertion de galeries d'images dans les articles/pages, réglages et configurations des galeries d'images.