Trois méthodes pour personnaliser le code de WordPress

Le moteur

WordPress peut être personnalisé de nombreuses façons.

D’abord grâce aux thèmes pour la partie graphique, grâce aux extensions pour la partie fonctionnelle, mais il est également possible de mettre les mains dans le moteur pour le personnaliser davantage encore, pour par exemple modifier le logo de la page de connexion ou ajouter le script pour Google Analytics sans plugin.

D’ailleurs, de nombreux sites traitant de WordPress proposent des bouts de code prévus à cet effet.

Nous allons faire un point sur les trois moyens habituels pour ajouter ces bouts de code.

Modifier le thème

Un moyen simple d’ajouter des fonctionnalités est de modifier le fichier functions.php qui se trouve dans le dossier du thème, pour y insérer les quelques lignes de code nécessaires. Il se trouve dans wp-content/themes/<nom de votre thème>/functions.php.

Cette méthode semble pratique, mais je vous la déconseille fortement : à chaque mise à jour du thème, le fichier sera écrasé. D’abord, il faudra penser à recopier le fichier après chaque mise à jour. Ou pire : si vous n’avez pas sauvegardé le fichier, vous aurez perdu les modifications.

Créer un thème enfant

La deuxième méthode demande un peu plus de préparation, mais est largement plus flexible que la première : il s’agit de créer un thème enfant, c’est-à-dire un thème qui se base sur celui que vous avez choisi, pour n’en modifier que quelques parties.

Le mode d’emploi complet se trouve sur le codex WordPress en Français. Je vous conseille de le lire, surtout si vous voulez personnaliser la présentation de votre thème.

Pour les modifications dont il est question ici, voici les étapes à suivre :

1) Créez un nouveau dossier dans wp-content/themes/ à côté du dossier de votre thème. Nommez le par exemple mon-theme-enfant.

2) Créez dans ce nouveau dossier un fichier style.css avec ce code :

/*
Theme Name: <Nom de votre theme enfant>
Author:  <Votre nom>
Template: <nom du repertoire du theme d'origine, par exemple twentytwelve>
*/
 
@import url("../<nom du repertoire du theme d'origine, par exemple twentytwelve>/style.css");

A vous de remplacer les parties entre < et >.

L’en-tête (la partie entre /* et */) permet de donner à WordPress quelques informations, notamment Template qui indique quel thème sert de base à votre thème enfant. L’autre partie (la ligne commençant par @import) sert à importer le fichier CSS du thème de base.

3) Créez de la même façon un fichier rtl.css pour y ajouter :

/*
Theme Name: <Nom de votre theme enfant>
Author:  <Votre nom>
Template: <nom du repertoire du theme d'origine, par exemple twentytwelve>
*/
 
@import url("../<nom du repertoire du theme d'origine, par exemple twentytwelve>/rtl.css");

4) Copiez le fichier screenshot.png qui se trouve dans le dossier du thème de base dans le dossier du thème enfant. Vous pouvez modifier ce fichier si vous le souhaitez.

5) Maintenant, l’étape qui nous intéresse le plus : créez un nouveau fichier functions.php.

C’est dans ce fichier que vous pouvez insérer tous les bouts de code récoltés sur les sites spécialisés.

6) Le thème devrait être disponible dans la partie ‘Apparence’ de l’interface d’administration. Activez simplement le thème enfant.

Attention : quelques réglages liés au nom du thème peuvent être perdus lors du changement vers le thème enfant, comme par exemple la bannière de l’en-tête. En réactivant le thème de base, les paramètres devraient être restaurés automatiquement.
En clair, notez toutes les personnalisations du thème de base que vous avez faites dans l’interface d’administration pour les appliquer sur le thème enfant.

Créer une extension

La troisième solution est de créer une extension simple. Et grâce à WordPress, c’est un jeu d’enfant.

Dans le dossier wp-content/plugins, créez un dossier, par exemple mon-extension.
Dans ce nouveau dossier, créez un nouveau fichier, par exemple mon-extension.php.

Modifiez ce fichier avec votre éditeur de texte favori, pour y ajouter cet en-tête :

<?php
/*
Plugin Name: Le nom de votre extension
Description: Quelques fonctions pour WordPress
Version: 0.0.1
Author: Votre nom
*/
 
// Vos personnalisations ici
?>

Modifiez les champs à votre convenance. Ensuite, ajoutez le code à l’endroit prévu.

Par exemple, pour ajouter le code permettant de cocher par défaut la case ‘Se souvenir de moi’ de la page de connexion :

<?php
/*
Plugin Name: partage-it.com
Description: Quelques fonctions pour personnaliser WordPress
Version: 0.0.5
Author: David
*/
 
// Ce qui suit permet de cocher par défaut la case
// 'Se souvenir de moi' sur la page de connexion
function sf_check_rememberme() {
	global $rememberme;
	$rememberme = 1;
}
add_action("login_form", "sf_check_rememberme");
?>

Ensuite, l’extension agit comme les autres : elle apparaît dans la partie ‘Extensions’ de votre interface d’administration.
La première fois, elle doit être activée.

La nouvelle extension WordPress dans l'interface d'administration
La nouvelle extension WordPress dans l’interface d’administration
Vous pouvez modifier le contenu, les mises à jour seront prises en compte automatiquement.

Si vous voulez aller plus loin avec les extensions, encore une fois, jetez un oeil au codex (en anglais cette fois).

Le mot de la fin

Pour résumer, la meilleure méthode est un mélange entre la deuxième et la troisième :

  • dans le fichier functions.php du thème enfant si la modification a un rapport avec la présentation, comme par exemple, l’ajout de l’image à la une en début d’article qui n’est pas gérée par le thème, … En d’autres termes, les modifications qui n’ont plus lieu d’être si vous changez de thème.
  • dans une extension maison, quand la modification est générique, comme une modification dans le tableau de bord, la customisation du flux RSS, …

Je vous conseille aussi, quelle que soit la méthode choisie :

  • d’éviter de modifier le fichier directement dans l’interface d’administration de WordPress, mais dans un éditeur de texte.
    En effet, en cas d’erreur, dans le code PHP par exemple, WordPress ne s’affichera plus, y compris l’éditeur de l’interface d’administration.
  • de faire une sélection de ce que vous avez vraiment besoin et de n’inclure que ce qui vous sera utile, pour des raisons de performance.
  • de bien commenter chaque ajout en ajoutant du texte libre après deux slash, par exemple // mon commentaire.

Pour terminer, je vous propose un article pour peupler votre nouvelle extension ou votre thème enfant, et personnaliser l’interface d’administration.

Cet article vous a été utile ? Partage it !

3 réflexions au sujet de « Trois méthodes pour personnaliser le code de WordPress »

  1. Bonjour, sympa les infos je vois plus claire : Configurer WordPress SEO by Yoast. Que peu t’ on faire comme amélioration dans la feuille de style.CSS. Merci bonne fin de congé, bye,bye.

    1. Bonjour Éric,
      je suis content que cet article te soit utile. Si tu souhaites plus de détails concernant les améliorations supplémentaires du fichier style.css, je te conseille les articles de ce blog concernant les optimisations.
      David

Laisser un commentaire

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

Si vous le souhaitez, renseignez le champ 'Nom' de cette façon : 'VotreNom@VotreMotClef' pour obtenir une ancre optimisée pour les moteurs de recherche.