L’espace d’expérimentation de Maccimum Communication

Souscrire par E-mail

WordPress : comprendre les thèmes et les modèles

Si vous souhaitez vous lancer dans la création de votre thème WordPress, vous devrez au préalable faire l’effort de comprendre les principes de bases qui régissent cette plate-forme de blog. Cet article explique de quelle façon est organisée la structure d’un thème WordPress.

En bref, on a avec WordPress un système de template PHP classique, avec des fichiers de modèles hiérarchisés (la page index.php étant la page par défaut, puis les pages spécifiques dédiées aux catégories, aux auteurs, aux archives, aux commentaires), et des fichiers spécifiques tels que le header, le footer, les sidebars, qui vont apparaître à l’intérieur des pages.

Qu’est-ce qu’un thème WordPress (template) ?

C’est le thème qui donne son identité au blog et qui “habille” son contenu. C’est en fait la couche graphique que voit l’internaute, mais pas uniquement. En effet, le thème prend en charge non seulement le design (polices utilisées, couleurs des différents éléments et hyperliens…), mais aussi la mise en page du contenu de votre blog (quels éléments afficher et leurs positionnements). Précisons également qu’un thème modifie la façon dont le site est affiché, sans changer le logiciel sous-jacent.

Un thème WordPress est composé d’un ensemble de fichiers de modèles qui fonctionnent conjointement. Ils forment une structure unifiée. Ces fichiers sont rassemblés dans un dossier unique portant le nom de votre thème et sont situés dans le répertoire (../wp-content/themes/votre-theme/).

Dans ces fichiers de modèles sont insérés des balises de modèles. Ce sont ces marqueurs PHP qui extrait les informations de chacun des fichiers de modèles pour l’injecter dans la page qui sera affichée.

Voici les différents éléments composant un thème WordPress :

• la feuille de style du blog : style.css (CSS = Cascading Style Sheets).
• les fichiers composant le thème, appelés fichiers de modèles : header.php, index.php, footer.php, sidebar.php…
• un fichier permettant d’ajouter des fonctionnalités optionnelles à votre thème : functions.php. Il n’est pas obligatoire.
• les images utilisées pour habiller le blog.

Les noms des fichiers de modèles sont identiques quels que soient le thème WordPress utilisé. Un gain de temps énorme lorsque l’on passe son temps à personnaliser des thèmes WordPress récupérés à droite à gauche. On retrouve plus facilement les différents éléments puisqu’ils sont toujours à la même place.

Quelle est la structure d’un thème ?

Un blog WordPress est généralement composé de quatre zones, nécessitant au moins quatre fichiers de modèles et une feuille de style :

Seuls deux fichiers sont obligatoires pour qu’un thème puisse être considéré comme valide par WordPress : index.php pour le code PHP, et style.css pour la mise en forme du blog.

Signalons la place essentielle du fichier index.php : c’est là où se déroule principalement l’action. Ce fichier extrait les articles du blog et les affiche. Lorsque le fichier template demandé n’existe pas, c’est lui que WordPress affiche, si bien que l’on pourrait très bien n’utiliser que ce fichier-là pour contrôler l’apparence du site. Mais ce ne serait pas très pratique.

Qu’est-ce qu’une feuille de style ?

Écrit à l’aide du langage CSS (Cascading Style Sheet), le fichier style.css ne sert pas à produire le contenu du site, mais plutôt à le formater. En fait, ce fichier pilote tous les aspects de mise en page du thème de votre blog : emplacement des différents éléments, polices utilisées, couleurs des hyperliens. Ce fichier contient également les informations que WordPress affichera au sujet du thème : nom du thème, version, nom de l’auteur, date de publication…

Pour que WordPress puisse reconnaître correctement votre thème et afficher les infos le concernant, il faut que le fichier style.css contienne les premières lignes suivantes (à adapter selon votre cas) :

/*
   Theme Name: Le Nom de votre Theme
   Theme URI: http://www.votre-site.com/
   Description: Thème personnel et personnalisé de…. Création originale de… pour…
   Version: 1.0
   Author: Votre Nom
   Author URI: http://www.votre-site.com/profil.html
   ************************************************
   * COPYRIGHT ou LICENCE (à personnaliser)
   * Ce theme est une creation exclusive de… pour…
   * Tous droits reserves Copyright (C) 2012 Votre Nom/Société
   * This theme was designed and built by… for…
   * All rights reserved Copyright (C) 2012 Votre Nom/Société
   ************************************************
 */

Chaque thème est illustré dans le panneau d’administration par une image miniature nommée screenshot.png. On la trouve à la racine du dossier de thème (wp-content/themes/mon-theme/screenshot.png).

Qu’est-ce qu’un fichier de modèle (template files) ?

L’appellation fichiers de modèle (template files) regroupe tous les fichiers PHP du thème, à l’exception des fichiers spéciaux comme functions.php.

Il existe deux types de fichiers de modèles :

• Les fichiers principaux qui composent le thème. Reliés entre eux, ils vont créer et afficher la page Web. Les principaux sont : index.php, single.php, page.php, category.php, archive.php, search.php…
• Les fichiers partiels qui sont des inclusions affichant des parties spécifiques à l’intérieur des pages du blog. Les plus utilisés sont : header.php, footer.php, sidebar.php, searchform.php…

Tous ces fichiers templates sont reliés entre eux sous forme de hiérarchie. En fonction de ce qu’il doit afficher, WordPress regarde dans le répertoire du thème et utilise le premier fichier de modèle qu’il trouve… selon la hiérarchie d’appel reproduite dans le schéma synoptique ci-dessous.

Si votre blog est à l’adresse http://mon-site.com// et qu’un visiteur charge la page http://mon-site.com/, WordPress cherche un fichier de modèle appelé home.php et l’utilise pour générer la page. Si home.php n’existe pas, WordPress recherche un fichier appelé index.php dans le répertoire du thème et l’utilise alors pour générer la page.

Qu’est-ce qu’une balise de modèle (template tag) ?

Les balises (ou marqueurs) de modèles permettent :

• de connecter tous les fichiers de modèles entre eux pour former le thème qui devient une seule et même entité.
• de gérér et générer l’ensemble des contenus dynamiques de WordPress.

Un marqueur de modèle est une instruction PHP qui demande à WordPress de faire ou d’afficher quelque chose. Dans le cas du marqueur de modèle header.php permettant d’afficher le nom de votre site WordPress, il ressemble à :

<?php bloginfo('name'); ?>

Chaque balise débute par une fonction qui lance PHP (<?php) et se finit par une fonction qui l’arrête (?>). Entre ces deux commandes se trouve la requête faîte à la base de donnée lui indiquant ce qu’il doit récupérer et afficher (ici bloginfo).
Dans cet exemple, le mot name lui demande de récupérer le nom du blog. On appelle cela un paramètre. Les paramètres sont placés entre les parenthèses de la balise, et entre guillemets. Le plus souvent, ils tirent leur valeur des paramètres du panneau d’administration de WordPress. À noter que beaucoup de balises ne possèdent pas de paramètre.

Voici la liste complète des balises valides de modèles WordPress, par catégories :

Pour tout savoir sur les balises de modèles et leurs paramètres, consultez les articles du Codex WordPress :

• Découvrir les Marqueurs de modèles.
• Marqueurs de modèles.
• Liste exhaustive et officielle des Template Tags (en anglais).

Qu’est-ce que la boucle WordPress (The Loop) ?

La Boucle (The Loop) est une fonction PHP permettant d’appeler n’importe quel contenu (titre d’article, texte de commentaire, liens…) depuis la base de données, à l’aide des fameuses balises (ou marqueurs) de modèles évoqués plus haut. Par l’utilisation de La Boucle, WordPress traite tous les Articles devant être affichés sur la page active et adapte leur présentation en utilisant les critères décrits par les marqueurs de La Boucle.

La Boucle est présente non seulement dans index.php mais aussi dans single.php, category.php, page.php, archive.php, search.php… Elle est l’élément central et indispensable permettant d’afficher précisément ce que l’on souhaite. Ainsi, il est possible d’afficher tous les articles en ordre chronologique décroissant, ou bien tous les articles d’une catégorie, ou encore les articles d’une période donnée et enfin les articles d’un auteur. Si on désire afficher une sélection d’article personnalisée, il faut mettre les mains dans le code avec la requête query_posts().

Pour en savoir plus sur la Boucle WordPress, et les différents marqueurs de modèles qui ne fonctionnent que dans la Boucle :

• Codex fr : La Boucle.
• Codex : The Loop in Action.

Qu’est-ce que le fichier functions.php ?

Ce fichier – qui n’est pas obligatoire – permet d’ajouter certaines fonctionnalités au thème, dont certaines peuvent être gérées via l’interface d’administration de WordPress.

Par exemple, c’est dans ce fichier que se trouve la fonction PHP permettant de « widgetiser » la sidebar (c’est-à-dire de la rendre gérable par l’administration de wordpress), ou bien encore celles permettant de filter les headers 301 et 404 (redirections, héritages…) ou de gérer les fichiers de traductions…

Conclusion

Comprendre les thèmes et les modèles WordPress c’est la possibilité de créer son propre thème, à son image, mais aussi la possibilité d’avoir le contrôle total sur la façon dont il fonctionne.
——
Pour tous renseignements complémentaires, contactez-nous :
www.maccimum.fr (communication globale, tous supports, tous médias).
——

À lire également :

• WordPress : ajouter des modèles spécifiques à un thème
• WordPress : comment widgetiser un thème
• Le Codex WordPress francophone
• WordPress SEO : l’optimisation du référencement
• Une sélection des meilleurs thèmes WordPress

Si vous avez apprécié cet article, prenez le temps de laisser un commentaire ou souscrire au flux afin de recevoir les futurs articles directement dans votre lecteur de flux.

Commentaires

Copyright 2009 Maccilabo – Société Maccimum. All rights reserved

• Contactez-nous
• Nos Services
• Mentions Légales