Thèmes Wordpress: éléments et structure

Thèmes WordPress: éléments et structure

Thèmes WordPress: éléments et structure

 

Le programme de blogging Web WordPress se caractérise par une séparation entre design et noyau de programmation. Les thèmes permettent d’adapter la représentation des contenus du site Web au niveau du Frontend, sans changer le programme en lui-même. Un thème WordPress dispose d’un code source, décrivant comment les contenus enregistrés sur un serveur peuvent être chargés et combinés pour que l’un navigateur Web puisse présenter un contenu homogène lors du chargement d’une page dynamique. Pour des exploitants de pages Web, les thèmes offrent par conséquent la possibilité de concevoir librement, dans la limite des options disponibles, le design et la mise en page d’un site WordPress.

La structure d’un thème WordPress est composée de divers fichiers source PHP, couramment appelés fichiers Templates, feuilles de calcul (Stylesheets), données de localisation, ou optionnellement des fichiers JavaScript et autres graphiques. Nous vous montrons dans cet article quels éléments de thèmes WordPress sont bons à connaître, quelles fonctions ils remplissent et comment ces différents éléments constitutifs collaborent.

Une petite illustration:

 

 

Eléments d’un thème WordPress

Par le passé, une page Web statique était basée sur un document HTML unique  qui rassemblait les contenus et les éléments JavaScript et CSS. Les thèmes WordPress quant à eux sont composés de plusieurs fichiers Template.  L’intégration de ces différents Templates se fait grâce à la balise Include, permettant d’en inclure plusieurs. Ainsi les contenus issus d’une base de données sur un serveur peuvent être reliés à la page Web et ainsi représentés sur le navigateur Web. Si cette représentation doit impliquer certaines conditions, celles-ci peuvent être précisées dans les balises conditionnelles (Conditional-Tags). On utilise pour cela des plugins appelés Template-Hooks. L’édition de contenus est gérée via un mécanisme caractérisé de Loop selon la terminologie WordPress.

Fichiers de templates

Un thème WordPress, avec ses éléments de base, peut être considéré comme un genre de plan de construction pour un site recouvrant différents états. Les pages Web dynamiques ainsi créées et livrées au navigateur Web se composent d’éléments spécialement adaptés à une requête précise : si un utilisateur charge une page de votre site Internet, l’ensemble du Blog WordPress, un avis individuel ou encore un commentaire. Ces modules de base sont appelés des fichiers de Templates. Il s’agit de fichiers source PHP, un mélange d’HTML, de code PHP et de balises de Templates possédant des tâches définies respectivement, et avec exactitude.

Un thème WordPress est considéré comme en état de marche s’il contient des fichiers Template index.php et style.css. En général, une multitude de fichiers Template différents (représentant différents types de contenus) peuvent se trouver dans un thème WordPress. Cela permet d’élargir le panel de fonctions d’un même Template et de votre Blog par extension. Voici une liste des fichiers de Templates de base se trouvant dans presque tout thème WordPress :

  • header.php
    C’est le fichier global qui affiche les en- têtes et la barre de navigation, il contient également le code HTML.
  • index.php 

Il s’agit du second élément obligatoire d’un thème WordPress. Celui-ci offre une vue d’ensemble d’un article et peut être utilisé comme page d’accueil. Au sein de la hiérarchie du Template, le fichier index.php est le dernier élément et sert de fichier de secours. Autrement dit, si aucun autre fichier de Template n’a été créé spécifiquement pour l’édition de contenu, le programme recourt au fichier index.php. L’établissement d’index.php dépend essentiellement du nombre de codes sont intégrés à d’autres fichiers de Templates. Tandis que le fichier index.php d’un thème WordPress simple contient souvent l’ensemble du code source incluant le répertoire racine HTML, le Header, Footer, Sidebar et la navigation, ces éléments sont incorporés dans des fichiers de Templates supplémentaires avec les thèmes les plus complexes (par exemple header.php, footer.php ou encore sidebar.php) de manière à ce que le fichier index.php remplisse seulement la fonction de squelette de base. Le fichier index.php montre en général un aperçu des articles dans la zone d’administration.

  • page.php

Il permet de représenter les contributions par ordre chronologique. Outre ces contenus dynamiques, de nombreux exploitants de sites Web mettent à la disposition de leurs utilisateurs des contenus spéciaux comme « A propos de l’auteur » par exemple, ou encore des mentions légales, etc, en tant que pages Web statiques. il est possible de créer ce fichier page.php indépendamment de la mise en page et du design d’autres fichiers de Templates comme index.php ou single.php. Pour cela, il suffit de copier le fichier page.php, le renommer, et y mettre le code suivant: <?php /* template name: nom_de_la_page */ ?>.

  • single.php

L’affichage des messages individuels dans votre thème WordPress est contrôlé par un petit fichier appelé single.php. Tandis que le fichier index.php propose un aperçu de plusieurs articles, single.php est utilisé par les personnes souhaitant avoir un aperçu unique d’un seul article.

  • archive.php, category.php, tag.php, author.php, date.php

En dehors de la fonction de recherche, WordPress propose une série de fichiers de Templates avec lesquels il est possible d’ordonner les contributions d’un blog selon certains critères précis. Les catégories, mots-clés, auteurs, ou la date de publication peuvent par exemple servir de filtres possibles. L’édition des contenus se fait avec category.php, tag.php, author.php ou date.php sur WordPress. Si ces fichiers de Templates spécifiques ne sont pas présents, le programme recourt au fichier archive.php.

  • footer.php

Il contient les instructions pour le pied de page global, et les balises fermantes du document HTML.

  • Sidebar.php

L’affichage de la sidebar est contrôlé dans ce fichier.  des sidebars multiples peuvent être mis en place dans functions.php, et le contenu des widgets de la barre latérale sont mis en place à partir du panneau WordPress de-admin.

  • style.css

Il s’agit de l’un des deux éléments de thème WordPress obligatoires. Ce fichier contient des informations d’en-têtes comme le nom du thème, une courte description, le nom du développeur, le numéro de version, la licence du thème ainsi qu’un lien vers celui-ci. Le fichier style.css est donc la feuille de calcul principale du site Web WordPress et laisse de la place pour le code CSS du thème.

  • function.php

Functions.php vous permet de mettre votre propre code PHP personnalisé afin de modifier des éléments clés de votre thème. Il est souvent utilisé pour spécifier plusieurs barres latérales, modifier le nombre de caractères dans l’extrait ou ajouter des options dans la barre d’administration WordPress.

La boucle (loop)

La boucle est définie par un mécanisme responsable de l’affichage de contenus au sein du logiciel WordPress. Fondamentalement, il s’agit de diverses fonctions WordPress reliées entre elles avec des balises conditionnelles. L’exemple ci-dessous vous montre la structure de base d’une boucle WordPress :

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
   <h2><?php the_title(); ?></h2>
 
<?php endwhile; endif; ?>

L’extrait de code if (have_post()) de la première ligne demande au programme WordPress de vérifier si les contributions en question du blog sont à disposition. Si les contributions se trouvent dans la base de données, la section de code while (have_posts()) : the_post() ordonne au logiciel d’exécuter les fonctions suivantes en boucle jusqu’à have_posts(), ou autrement dit, jusqu’à ce que plus aucune publication ne soit disponible.

La boucle résume par conséquent toutes les fonctions jusqu’au PHP statement à la ligne 6. Dans cet exemple, la fonction the_title(), sert à l’édition du titre d‘un article, et la fonction the_exerpt(), à indiquer au logiciel de charger un extrait de contribution de la base de données.

Sur la page d’accueil de WordPress, une boucle simple a pour effet d’afficher les titres et aperçus de textes les uns avec les autres, en commençant par les plus récents. Le nombre de contributions affichées peut être configuré dans la zone d’administration. Les boucles WordPress plus complexes comme les métadonnées Author, Date, Category et Tags contiennent un lien pour un affichage isolé de l‘élément en question.

Et voilà, vous savez tout ce qu’il y a à savoir sur la structure d’un thème WordPress et sur son fonctionnement. N’hésitez pas à revenir pour d’autres articles encore plus instructifs les uns et autres.

 

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *