Décoder WordPress : Apprendre à Connaître l’Éditeur de Thème WordPress

Cherches-tu à débloquer tout le potentiel de ton site WordPress ?

Les novices et les pros de WordPress savent qu’il y a tellement d’opportunités de personnalisation à travers la plateforme.

Et beaucoup de ces occasions résident dans ton thème WordPress.

Cependant, jouer avec un thème WordPress peut avoir des conséquences désastreuses pour les non-initiés.

C’est pourquoi nous sommes là pour t’aider à te préparer.

Continue de lire pour une explication approfondie de l’éditeur de thèmes de WordPress et comment trouver ton meilleur thème, l’activer sur ton site web et le personnaliser pour qu’il corresponde à ton entreprise et à ton secteur.

Remarque : Il existe des différences entre les sites WordPress.com et WordPress.org ! WordPress.com est un créateur de sites en ligne où tu peux créer un site abordable et moins personnalisable. WordPress.org est un logiciel libre et gratuit où tu peux construire un site personnalisé qui nécessite un hébergement web. Dans cet article, nous nous concentrerons sur WordPress.org, mais les deux plateformes utilisent des thèmes et partagent de nombreuses similitudes. 

Rafraîchissement : Les Bases Des Thèmes WordPress

Avant de nous plonger dans les détails de la modification de ton thème WordPress, rafraîchissons rapidement nos connaissances sur ce que comprend un thème.

Dans WordPress, un thème est essentiellement un groupe de fichiers qui travaillent tous ensemble pour contrôler l’apparence et la fonctionnalité d’un site web. Ces fichiers contiennent des choses comme des modèles de page, des feuilles de style en cascade (CSS) et plus encore.

Chaque site lancé sur WordPress vient avec un thème. Si tu souhaites changer le thème par défaut, tu peux choisir un thème WordPress dans le répertoire officiel de thèmes de la plateforme ou dans un marché populaire comme ThemeForest.

Ou, bien sûr, tu peux personnaliser ton thème en utilisant n’importe lequel des processus que nous allons discuter dans cet article, qui varieront des tactiques sans code aux tactiques avec code complet.

Thème Vs. Modèle

Les thèmes sont l’un des éléments les plus cool et les plus adaptables de WordPress.

Veux-tu changer radicalement l’apparence et la disposition de ton site web ?

Change simplement le thème !

Changer de thème n’est pas difficile, grâce à la facilité avec laquelle WordPress a rendu la recherche, l’installation, l’activation et même la modification de la plupart des thèmes. Avec des milliers d’options gratuites dans le répertoire de thèmes WordPress et des milliers d’autres proposées par des tiers, la plupart des gens peuvent trouver un thème qui correspond à leur secteur d’activité, à leurs besoins fonctionnels et à leur compétence technique.

Cependant, il y a quelque chose que la plupart des thèmes ne peuvent pas t’aider à faire — et c’est rendre les différentes pages totalement uniques les unes des autres.

Imaginons que tu veuilles que différentes pages aient des dispositions très différentes. Ou, tu souhaites des éléments de design similaires sur différentes pages mais veux que le contenu à l’intérieur soit unique. Étant donné que les thèmes appliquent le style à l’ensemble du site web, il est plus difficile de modifier cela via ton thème.

C’est là que les modèles entrent en jeu.

Les modèles ne sont pas différents des thèmes ; ils se concentrent simplement sur les fonctionnalités de pages individuelles ou de types de pages plutôt que sur le site dans son ensemble.

La plupart des thèmes sont fournis avec des modèles prédéterminés pour contrôler tes pages, mais tu peux également les modifier et créer les tiens. Cependant, ce processus peut être encore plus complexe que de travailler avec des thèmes, donc si tu es intéressé par la personnalisation des modèles, nous te recommandons fortement de lire Décoder WordPress : Modèles personnalisés et parties de modèles.

Qu’est-ce Que L’Éditeur De Thème WordPress ?

Cette section commence avec un peu de clarification.

Pendant longtemps, l’éditeur de thème était le nom de l’éditeur de texte à l’intérieur du tableau de bord administrateur de WordPress, permettant aux utilisateurs de modifier le code dans les fichiers du thème.

Cela est toujours là et sera le point central de cet article. Cependant, aujourd’hui, cela s’appelle techniquement l’éditeur de fichiers de thème. Donc, si ton instance WordPress est à jour — ce qu’elle devrait être pour des raisons de sécurité ! — tu travailleras avec l’« Éditeur de fichiers de thème » au lieu de l’« Éditeur de thème ». Tu remarqueras que nous utilisons encore souvent l’ancien terme car beaucoup de personnes le connaissent.

Nous devrions prévenir que travailler dans l’éditeur de thème doit être fait avec une extrême prudence. Les modifications seront perdues si votre thème est mis à jour ou modifié. Il est aussi assez facile de briser la conception et la fonctionnalité de votre site web — et, dans le pire des cas, vous pourriez même vous exclure de votre site !

Si tu n’as pas beaucoup d’expérience avec WordPress ou la programmation, nous te recommandons de commencer par la tactique de modification pour débutants et sans code, et de ne devenir plus technique que lorsque les choses commenceront à te sembler familières.

Pourquoi Utiliser L’Éditeur De Thèmes WordPress ?

Alors, pourquoi les gens se lancent-ils dans l’éditeur de thèmes WordPress en sachant qu’il est si sensible ? Parce que c’est le meilleur moyen d’accéder à tous les fichiers qui composent votre thème WordPress.

La plupart des éléments de design se retrouveront dans trois fichiers : style.css, functions.php et templates.

Alors que certains thèmes auront plus de fichiers contenant des fonctionnalités de design, discutons d’abord des éléments principaux auxquels tu peux accéder via l’éditeur de thème.

Fichier Style.css (alias Feuille de style)

La plupart des éléments liés au design d’un thème — typographie, couleurs, mises en page — se trouvent dans le fichier style.css, également appelé couramment la feuille de style.

Modifier, supprimer ou ajouter du code CSS dans ce fichier est une manière efficace de modifier le style de ton site web.

Fichier Functions.php

Functions.php est l’endroit où réside le code des fonctions et fonctionnalités de ton thème, écrit en PHP bien sûr.

Encore une fois, avec une extrême prudence, il est possible de modifier le code ici pour ajouter des éléments dans l’en-tête et le pied de page de ton site web, changer les menus de navigation, mettre à jour le formatage des publications, etc.

Fichier de Modèles

Ton fichier de modèles contient soit des fichiers PHP, soit des fichiers HTML (selon le thème) qui composent la mise en page des pages de ton site web.

Si tu veux modifier l’apparence de certaines pages ou types de pages (pense aux pages de publications, pages d’archives, etc.), tu devrais faire les modifications dans les fichiers de modèle.

Comment Utiliser L’Éditeur De Thème WordPress

Maintenant, pour l’événement principal !

Continue de lire pour apprendre tout ce que tu devrais savoir lors du choix, de l’installation, et de la personnalisation sur mesure de ton thème WordPress.

Choisis Ton Thème

Pour acheter dans le répertoire de thèmes de WordPress, connecte-toi à ton site web WordPress.org, visite le Tableau de bord, et navigue jusqu’à Apparence > Thèmes.

Utilise le bouton Ajouter Nouveau en haut de la page à côté du titre de la page Thèmes ou le bouton Ajouter Nouveau Thème plus pour afficher tes options.

Tu peux parcourir tous les thèmes en promotion ou utiliser le filtre de fonctionnalités et la barre de recherche pour affiner les options.

Clique sur un thème ou passe ta souris dessus et utilise le bouton Aperçu pour en savoir plus sur le thème, ce qui peut inclure une description, une démo de son apparence, et parfois des avis.

Si aucune des options ne correspond à ce que tu recherches, tu peux également visiter des constructeurs de thèmes tiers et des marchés comme ThemeForest, StudioPress ou Elegant Themes mentionnés précédemment.

Tu essaies de trouver le même thème utilisé sur un site web que tu aimes ? Une ressource comme WordPress Theme Detector peut t’aider avec cela.

Installer Et Activer Ton Thème

Si tu as choisi un thème qui te plaît dans le répertoire WordPress, tu verras un bouton Installer lorsque tu cliques dessus ou que tu passes la souris dessus. Ce thème sera ajouté à ta page de thèmes en un seul clic.

Pour l’utiliser sur ton site web, retourne à la page principale des thèmes (Apparence > Thèmes) et clique sur Activer pour l’appliquer à ton site web.

Et si tu choisis un thème d’une autre source, il reste facile à utiliser dans WordPress.

Sur la page principale des Thèmes à nouveau, utilise le bouton Ajouter Nouveau en haut de la page à côté du titre Thèmes.

Sur la page suivante, tu verras un bouton au même endroit appelé Upload Theme.

Une fois que tu cliques ici, tu verras où télécharger le fichier .zip que tu as reçu de la source tierce. Choisis Installer maintenant pour le télécharger sur ta page de Thèmes. De là, tu peux l’activer comme n’importe quel autre thème.

Personnalise Ton Thème

Ceci est ton deuxième rappel que faire des modifications directement sur ton thème peut nuire à ton site web.

Une autre option à considérer si tu souhaites ajouter des fonctionnalités ou modifier l’apparence de ton thème actuel — plugins ! (Et des widgets !)

Les plugins et widgets WordPress sont des outils qui étendent la fonctionnalité et mettent à jour le style sans faire de modifications de code. De plus, ils sont simples à utiliser et très souvent gratuits ! Les plugins et widgets peuvent être utilisés pour améliorer le SEO du site (Yoast), installer des fonctionnalités e-commerce (WooCommerce), et bien plus encore.

Si tu as peur de modifier le code du thème ou si tu veux que tes mises à niveau durent même si tu changes ou mets à jour ton thème — essaie les plugins et les widgets.

Si tu ne trouves aucune extension qui répond à tes besoins et que tu décides tout de même de modifier ton thème, assure-toi de sauvegarder WordPress.

Pour une sécurité supplémentaire, tu peux faire une chose de plus pour protéger ton site au cas où la modification du thème se passe mal et pour conserver tes modifications tout au long des mises à jour du thème : Installe un thème enfant WordPress.

Un thème enfant WordPress fonctionnera exactement comme le thème « normal » dont il est dérivé — son thème parent. Modifier le thème enfant permet à tes personnalisations de perdurer à travers les mises à jour.

Avec ces avertissements écartés, il est temps de personnaliser !

Outils De Modification De Thème Intégrés (Idéal Pour Débutants)

Si tu regardes sous l’onglet Apparence à nouveau dans le Tableau de bord, tu devrais voir soit Éditeur soit Personnaliser.

Pour la plupart, Personnaliser est un outil qui t’aidera à éditer des thèmes non basés sur des blocs, tandis que Éditeur (qui porte plusieurs noms : Éditeur de Site, Éditeur de Blocs, etc.) est conçu pour les thèmes basés sur des blocs.

Quel que soit ton thème, les deux plateformes sont très visuelles, faciles à utiliser, et offrent des instructions détaillées pour modifier divers éléments du site.

Personnalise offre des options plus limitées pour modifier ton design, ta palette de couleurs, tes polices, etc. Les options de personnalisation varient selon le thème.

Toutefois, tu peux également ajouter du CSS personnalisé et/ou du JavaScript via Personnaliser. Assure-toi simplement de cliquer sur Publier pour appliquer les mises à jour effectuées.

Avec l’outil Éditeur pour les thèmes basés sur des blocs, tu peux approfondir la personnalisation des pages, des modèles, du style, etc. Encore une fois, les options varieront quelque peu selon le thème.

Pour la plupart des éléments dans Editor, tu peux modifier le code directement.

Par exemple, si nous sélectionnons Styles et cliquons sur la page pour commencer à éditer, un panneau plein d’options apparaît sur le côté droit de l’écran.

Une barre d’outils devrait également s’ouvrir en haut de la page. Utilise la menu à trois points pour ouvrir une liste d’options, y compris une pour passer de éditeur Visuel à éditeur de Code.

C’est ici que tu peux travailler dans le code. Utilise le bouton Enregistrer pour appliquer les modifications à ton thème et à ton site.

Il y a beaucoup à apprendre concernant cette manière quelque peu nouvelle de modifier les thèmes WordPress. Pour plus d’informations, consulte Qu’est-ce que l’édition complète de site WordPress ? Et comment cela affectera-t-il ton site ?

Gestionnaire de Fichiers de l’Hôte (Codage Requis)

Maintenant, nous entrons dans le territoire du codage.

Pour la plupart des sites WordPress hébergés, tu peux accéder et modifier les fichiers composant ton thème via le gestionnaire de fichiers de ton hébergeur.

Ce gestionnaire de fichiers aura une apparence différente pour chaque hôte, mais nous pouvons expliquer comment il fonctionne chez DreamPress.

Une fois connecté, va dans WordPress > Hébergement WordPress géré dans la barre latérale.

Trouve le site web que tu veux modifier et choisis Gérer.

Tu devrais arriver sur la page Détails pour ce site web. Dans la section Téléchargement de fichiers, sélectionne Gérer les fichiers.

Ouvre le dossier qui porte le nom de domaine de ton site web. À partir de là, tu peux naviguer vers wp-content > themes. Clique sur le dossier de ton thème WordPress actuel, ou sur celui d’un autre thème que tu souhaites modifier.

Comme ça, tu regardes tous les fichiers où tu peux apporter des modifications pour mettre à jour ton thème.

Assure-toi de sauvegarder toutes les modifications que tu effectues dans l’éditeur de fichiers.

Éditeur de Fichiers de Thème WordPress (Le Plus Avancé)

Plus de codage à venir !

Pour modifier ton thème depuis WordPress, retourne au Tableau de bord et dirige-toi vers Apparence > Éditeur de fichiers de thème (ce qui était autrefois appelé « Éditeur de fichiers de thème »).

L’éditeur de texte devrait s’ouvrir ; sur le côté droit, tu devrais voir une liste de fichiers de thème. Clique dans ces fichiers pour effectuer tes modifications.

Utilise le bouton Update File après avoir terminé tes mises à jour. Si des erreurs de syntaxe sont présentes dans le code, WordPress t’empêchera de sauvegarder tes modifications et mettra en évidence l’erreur afin que tu puisses la corriger plus facilement.

Si tu veux modifier un thème que tu n’utilises pas, il y a un menu déroulant au-dessus de l’éditeur de texte où tu peux sélectionner le thème que tu souhaites modifier.

N’oublie pas que choisir un thème différent ici ne changera pas automatiquement le thème utilisé par ton site web WordPress.

Pour cela, rends-toi dans Apparence > Thèmes une fois de plus pour activer un thème différent. C’est également là que tu peux vérifier si tes thèmes nécessitent une mise à jour. Il est important de les maintenir à jour pour installer les nouveaux correctifs de sécurité que le développeur du thème a déployés.

Mention Honorable : Plugin de Construction de Page (Sans Code)

Les plugins de création de pages disposent généralement d’éditeurs faciles à utiliser par glisser-déposer pour concevoir des pages de sites web — et non des thèmes. C’est pourquoi nous les avons classés comme mentions honorables. Elementor et WPBakery sont des exemples populaires de plugins de création de pages.

Elementor peut être utilisé comme un créateur de site web seul ou comme un plugin WordPress, mais dans ce dernier cas, il ne peut être utilisé que comme éditeur de page.

Techniquement parlant, tu peux toujours utiliser Elementor pour créer et modifier des pages qui ressemblent exactement à ce que tu veux — aucun édit de thème n’est nécessaire.

Pour utiliser ce plugin, rends-toi dans Plugins > Add New et recherche « Elementor ».

Utilise le bouton Installer maintenant, puis clique sur Activer pour activer Elementor dans la barre latérale de ton tableau de bord WordPress.

Nous te recommandons de suivre le guide étape par étape « Commencer » d’Elementor pour apprendre les ficelles de cet outil, car il est impressionnant de puissance. Une fois que tu maîtrises les bases, tu peux utiliser le plugin Elementor pour concevoir de magnifiques articles et pages individuels.

Bien que Elementor ne soit pas un outil d’édition de thème au sens traditionnel, il peut être incroyablement bénéfique pour quiconque souhaite personnaliser son site web sans coder.

Et si tu choisis de payer pour Elementor Pro, tu peux réellement concevoir ton thème dans le constructeur de thèmes Elementor.

Peut-On T’aider À Décoder WordPress?

Les subtilités de WordPress sont pratiquement infinies — mais cela ne signifie pas que tu ne peux pas pleinement profiter du logiciel avec les bons conseils.

Reste informé grâce au blog de DreamHost pour toutes les dernières nouvelles de WordPress et apprends comment notre Hébergement WordPress et les Services professionnels peuvent t’aider à tirer le meilleur parti de ton site.