Modifier un thème WordPress: Les Bases

Depuis sa sortie, Wordress séduit de plus en plus d’utilisateurs pour sa simplicité et la richesse de ses outils par rapport aux autres CMS. La possibilité de personnaliser un thème est très aisée et permet d’obtenir un design unique. Pour pousser encore plus un thème, il faudra tout de même passer par des modifications dans le code.

Dans cet article, je vais vous expliquer Les bases pour modifier un thème WordPress afin de pousser d’avantage la personnalisation de votre blog.

 Comment se compose un thème wordpress ?

 

Un thème wordPress est le plus souvent composé des fichiers suivants:

style.css (permet d’effectuer des modifications dans le style du blog, taille des titres par exemple.)

single.php (destiné aux éléments intégrés aux pages, les titres et les infos importantes.)

sidebar.php (fichier réservé aux widgets, menus situés à droite ou à gauche d’un blog.)

page.php (représente chacune des pages d’un blog, différent de single.php)

archive.php (comme son nom l’indique, fichier qui est destiné aux archives d’un blog.)

index.php (représente généralement une partie de la page d’accueil, comme les extraits d’articles.)

header.php (représente l’en-tête, les menus dans la partie supérieure d’un blog.)

home.php (représente la Home page, la page d’accueil d’un blog.)

footer.php (représente le footer, le pied de page d’un blog, tout en bas.)

search.php (représente la fonction recherche d’un blog.)

comments.php (représente le système de commentaires.)

 

 

Quel est la différence entre .php et .css ?

 

Les .css permettent d’effectuer des modifications de style (changement de couleur d’un élément, modifications de la taille d’un élément, surlignage, gras, etc. style.css centralise le design de tous les éléments .php d’un thème wordpress.

Les .php permettent la modification des éléments. Par exemple, dans « search.php », vous pourrez modifier le système de recherche en profondeur, son fonctionnement, mais pas son style qui se trouvera dans le style.css.

Attention de ne pas confondre les deux. Pour illustrer, on peut dire que les .php sont les rouages d’un système et les .css leur apparence.

Identifier et personnaliser un aspect du thème WordPress (.css)

 

–La première chose à faire lorsque l’on veut modifier un aspect du thème wordpress choisi, c’est identifier  la partie du code désirée. Pour cela, plusieurs outils sont à votre disposition, mais nous nous contenterons du plus simple: la fonction « inspecter cet élément » intégrée dans Google Chrome et firefox.

Une fois que vous aurez cerné l’attribut exact que vous voulez modifier depuis votre navigateur internet, faites un clic droit dessus et cliquez sur « inspecter cet élément ».

Une fenêtre s’ouvre, elle ressemble à ceci:

 

(Cliquez pour zoomer)

–Ne paniquez pas lorsque vous verrez toutes les lignes colorées dans cette fenêtre, les couleurs sont plutôt là pour vous aider. Normalement, une des lignes sera surlignée dans un gris léger, celle-ci représentera l’élément que vous aurez sélectionné.

Positionnez le curseur de la souris sur cette ligne et vérifiez qu’il s’agit bien de l’élément désiré. Cliquez sur la ligne pour confirmer. Nous allons ensuite nous rendre dans la petite fenêtre à droite qui va vous permettre de vous donner une idée du bout de code à modifier.

Faites des tests, cochez et décochez des cases afin de cerner votre objectif. Pour vous aider dans vos recherches, voici une explication des principales fonctions css:

 

 

 

Color  (comme son nom l’indique, permets de modifier la couleur.)

Font-size (permet de modifier la taille de l’élément.)

text-align (permets de changer l’alignement.)

margin-left (permets d’ajouter une marge, ici en l’occurrence à gauche.)

font-weight (ajoute un attribut à la police. Par exemple, du gras (bold) , ou un surlignage.)

 

–Une fois que vous aurez déterminé l’aspect modifier, rendez-vous sur votre serveur FTP, ouvrez le fichier en question et commencez les modifications. Généralement, votre serveur FTP vous demande une confirmation de la modification, n’oubliez pas de confirmer sinon les changements ne seront pas effectifs.

ATTENTION: n’oubliez jamais de faire une sauvegarde préalable de chacun des fichiers à fin qu’en cas d’erreur, vous puissiez revenir en arrière.

 

 

–Pour vous faciliter la vie, je vous conseille le logiciel Notepad++, conçu spécialement pour vous aider à vous repérer dans les multiples lignes de code.

 


 

VOULEZ-VOUS EN SAVOIR PLUS ?

Suite aux nombreuses questions reçues, nous avons décidé de créer un ebook
plus complet, pour apprendre à modifier votre thème WordPress, pas à pas. Vous y trouverez
des explications détaillées pour savoir comment accéder aux fichiers, avec quels logiciels, où chercher et trouver l’endroit que vous souhaitez modifier ainsi que de nombreux exemples concis et illustrés !

Laisser un commentaire