Il arrive parfois que l’on trouve un thème WordPress qui nous convient pratiquement en tout, excepté pour quelques détails… qui sont souvent la taille, la couleur ou la police des caractères.

On peut bien entendu modifier la taille des caractère dans l’éditeur de texte qui permet d’écrire les articles et les pages, mais cette modification ne concernera que l’article ou la page en question ; cela est utile si on a besoin de le faire ponctuellement.

Il s’agit ici de modifier les caractères de tous les articles et de toutes les pages. La procédure est la suivante.

Dans le tableau de bord de WordPress, aller dans Apparence, puis Éditeur. Nous avons alors accès à la feuille de style Styles.css. Nous voyons quelques lignes de commentaire qui disent quel est le thème actif, puis une commande qui importe la feuille de style principale du thème, et, à la fin, une ligne de commentaire qui nous dit que c’est à partir de là que commence la section avec les descriptions de styles qui viendront se superposer aux styles définis dans le thème actif.

/*
Theme Name: Integral Child
Theme URI: http://www.themely.com/themes/integral/
Author: Themely
Author URI: http://www.themely.com/
Description: Child theme for Integral (Free Version)
Template: integral
*/

@import url("../integral/style.css");

/** Theme customization starts here
================================================**/

C’est à partir de là qu’il faut insérer le code permettant de modifier les styles ; par exemple, j’ai voulu ici, pour le texte des articles et des pages, ajuster mon texte, augmenter légèrement la taille des caractères, et les avoir en couleur noire. J’ajoute donc

p {
text-align: justify;
font-size: 1.15em;
color: #000000;
}

Ma feuille Styles.css contient à présent ceci :

/*
Theme Name: Integral Child
Theme URI: http://www.themely.com/themes/integral/
Author: Themely
Author URI: http://www.themely.com/
Description: Child theme for Integral (Free Version)
Template: integral
*/

@import url("../integral/style.css");

/** Theme customization starts here
================================================**/

p {
text-align: justify;
font-size: 1.15em;
color: #000000;
}

Enregistrer les modifications, puis aller en consultation sur le front-office de votre site. Vous constaterez que les modifications ont été prises en compte.

De très nombreuses ressources en ligne sont à la disposition de ceux qui souhaitent en savoir plus sur les styles et les feuilles de style en cascade CSS.

Notez que ces modifications risquent d’être perdues lors de la première mise à jour de votre thème. La solution est d’utiliser un thème « enfant » de votre thème, qui lui ne contient que vos ajustements et n’est pas écrasé lors des mises à jour de votre thème principal.