A ce jour, WordPress compte 2592 thèmes gratuits téléchargeables depuis le CMS. Largement de quoi trouver son bonheur ! Ou presque… Car il y a toujours un petit détail qui vous chatouille : Ne serait-ce que la couleur des titres, ou la taille des textes… Vous serez donc très vite tenté de modifier légèrement quelques paramètres, pour adapter le thème choisi complètement à vos attentes. Comment faire ? Facile !
2 solutions s’offrent à vous pour effectuer vos modifications, et personnaliser votre thème WordPress.
1° solution :
La première solution, la moins propre, consiste à modifier directement les fichiers du thème, et modifier les portions de code des articles, des commentaires, ou simplement de l’en-tête de votre document ou du fichier functions.php pour ajouter quelques morceaux de code trouvés sur la toile. Sachez qu’en faisant cela, il ne vous sera plus possible de mettre à jour votre thème. En effet, comme les plugins, les thèmes peuvent subir des mises à jour pour améliorer des fonctionnalités, mettre à jour de sécurité, etc. S’il vous validez la mie à jour d’un thème que vous avez modifié, vos modifications seraient tout simplement écrasées. Autant vous dire que ce n’est pas la meilleure des solutions !
2° solution : « Créer un thème enfant »
La deuxième solution, la meilleure, consiste à créer un thème enfant.
La création d’un thème enfant n’est pas très complexe et permet de bénéficier du thème parent tout en autorisant la modification de certains fichiers à partir du thème enfant.
Voyons cela plus en détail avec un exemple concret.
Dans notre exemple, nous allons créer un thème enfant à partir du thème Twentyfourteen, nous l’appellerons Radius-enfant
1) Création du dossier de thème
Créez un dossier nommé radius-enfant.
2) Création du fichier style.css
Dans le dossier que vous venez de créer, créez un fichier style.css avec comme contenu de base :
/*
Theme Name: Radius-blog-concept
Theme URI: http://blog-concept.com/
Description: Thème enfant pour le thème Radius
Author: Hansen
Author URI: http://blog-concept.com/
Template: Radius
Version: 0.1.0
*/
Toutes ces lignes de code servent à décrire le thème enfant. Ce descriptif s’affichera dans l’espace d’administration de votre blog WordPress (Apparence > Thèmes). Vous êtes relativement libres sur le contenu, sauf pour la ligne 7 (Template) qui est le « slug » (identifiant) du thème de référence, le thème parent. Ce slug correspond au nom du dossier du thème que l’on souhaite modifier, ici Radius, qui porte comme nom de dossier « Radius ».
Copier le contenu de style.css de Radius pour le coller dans votre CSS du thème radius-enfant
Téléchargez maintenant le dossier que vous venez de créer à l’aide de FileZila dans le dossier wp-content/themes de votre blog WordPress.
Votre thème enfant apparaît maintenant dans Apparance > Thèmes de l’espace d’admin de WordPress.
3. Activer votre thème enfant
Vous pouvez maintenant activer votre thème enfant. Celui-ci va simplement adopter le comportement de son thème parent, puisque nous n’avons encore aucun fichier « template » (par exemple header.php) dans notre dossier de thème.
3) Modification des templates
Il est désormais possible d’éditer les portions du templates parent comme bon vous semble. Comment ? Simplement en copiant le fichier à modifier depuis le thème parent, et en le collant dans votre thème enfant. Les modifications à apporter se feront sur les fichiers que vous avez copié depuis le thème parent dans votre thème enfant.
Prenons un exemple :
Copiez le fichier header.php du thème parent (Radius, pour rappel), puis collez-le dans votre thème enfant.
Vous avez maintenant dans votre dossier la feuille de style, et ce fichier header.php.
Ouvrez le fichier header.php pour édition et remplacez
- <h2 id= »site-description »><?php bloginfo( ‘description’ ); ?></h2>
par
- <p id= »site-description »><?php bloginfo( ‘description’ ); ?></p>
Le remplacement de h2 par p n’aura aucune incidence visuelle, par contre vous constaterez que le code a bel et bien changé.
Cet article vous a plu ? Offrez-nous un Like sur Facebook !
[efb_likebox fanpage_url= »blog-concept.like » box_width= »250″ box_height= » » colorscheme= »light » locale= »fr_FR » responsive= »0″ show_faces= »1″ show_header= »1″ show_stream= »0″ show_border= »1″ ]