Comment créer un thème WordPress facilement ?

Sommaire du cours sur la création de thèmes WordPress

1. Introduction
2. Prérequis
3. Préparatifs
4. Le fichier style.css
5. Le fichier index.php
6. Le fichier functions.php
7. Affichage du menu et des sidebars
8. Ajout du style à notre thème

Introduction à la création d’un thème WordPress

Que ce soit pour créer un site internet ou pour créer un blog, WordPress s’avère être un système de gestion de contenu de premier choix ! Certains l’utilisent même comme framework pour d’autres projets web. Avec ce tuto WordPress, vous allez découvrir comment créer un thème !

Pourquoi apprendre à créer un thème WordPress ?

La création de site internet avec ce CMS (Content Management System) open source est très fréquente. En effet, la facilité d’utilisation de WordPress est un véritable atout pour le développeur qui souhaite fournir à ses clients une interface simple et un site facile à administrer.

Créer un site web avec WordPress, c’est également très simple. Voici à quoi pourrait se résumer la mise en place d’un site :

1. Chercher un hébergeur ou faire une installation de WordPress en local
2. Se connecter en tant qu’admin au dashboard
3. Utiliser le thème par défaut ou choisir un nouveau thème
4. Installer quelques plugins / extensions si besoin
5. Paramétrer une sidebar et y ajouter un widget ou plusieurs
6. Créer une page d’accueil avec le page builder Gutenberg
7. Créer et gérer la mise en page des contenus

Bien sûr, même si utiliser un site ou blog WordPress est simple, un webmaster se retrouvera vite confronter à des limites niveau design. C’est là que se former à la création de thème prend tout son sens. En apprenant à coder un thème personnalisé, vous allez pouvoir créer un site WordPress qui coresspond à vos besoins. Par exemple : styliser et ajouter un nouveau menu, modifier des balises pour améliorer le référencement naturel, ajouter des codes html et css pour personnaliser l’entête, retoucher le front end d’un thème existant etc.

Il existe déjà beaucoup de tutos mais l’objectif de celui-ci est de vous fournir le meilleur tutoriel pour débuter avec WordPress et plus particulièrement dans la création de thème.

Dans ce guide, vous allez apprendre à créer un thème WordPress facilement et en très peu de temps. Que vous soyez néophytes ou déjà utilisateur averti de WordPress, j’ai regroupé toutes les informations essentielles pour que vous puissiez faire un thème 100% fonctionnel répondant à la plupart des besoins lorsque vous voudrez créer votre site internet ou un blog personnel sous WordPress.

Vous êtes prêt pour faire vos premiers pas parmi les développeurs WordPress ?

Le thème que nous allons créer sera parfaitement adapté pour un blog.

Le thème créé permettra notamment :

1. D’afficher les derniers articles du blog sur la page d’accueil
2. De disposer d’une barre latérale pour ajouter des widgets
3. De disposer d’un menu horizontal pour mettre en avant certaines pages
4. D’avoir un footer personnalisé
5. De s’adapter à différents écrans avec son mode responsive

Grâce à ce guide vous allez apprendre les choses suivantes :

1. Comment fonctionne un thème WordPress et comment l’afficher dans le panneau d’administration
2. Comment coder un thème pour WordPress en partant d’une feuille blanche
3. Comment gérer l’affichage des contenus dans un thème grâce aux templates
4. Comment gérer les menus dans WordPress
5. Comment gérer les sidebars et les widgets dans WordPress

Ensemble, nous allons créer un thème de base qui ressemblera à ça :

L’avantage de ce thème est qu’il est simple et qu’il laisse place à la personnalisation ! Il est parfait pour s’exercer et apprendre à créer son propre thème.

Prérequis

La création d’un thème WordPress nécessite quelques prérequis. Vous devez notamment savoir comment installer WordPress et disposer de quelques notions dans les langages html, css et php. En effet, ce sont ces langages qui font tourner WordPress. Si vous connaissez MySQL, c’est un plus !

Préparatifs du thème WordPress

Passons aux préparatifs du thème. Dans la première leçon de ce cours vous allez découvrir l’architecture d’un thème WordPress et ce qu’il faut faire pour qu’il soit reconnu dans le back office du CMS.

Vous découvrirez que pour faire fonctionner un thème, il suffit de créer un dossier et d’y ajouter seulement quelques fichiers.

Le fichier style.css

Pour que votre thème soit reconnu par le CMS WordPress, vous devez créer le fichier style.css. Ce fichier va permettre d’ajouter un thème dans l’interface d’administration.

Ce fichier n’est pas une simple feuille de style car elle sert à deux choses :

1. Configurer votre thème WordPress
2. Ajouter des règles de style

Le fichier index.php

La prochaine étape est la création du fichier index.php.

Dans WordPress, ce fichier php correspond à un fichier de template (aussi appelé « modèle WordPress »). Les fichiers de template sont des fichiers qui mêlent code HTML et php permettant d’afficher le contenu de notre site WordPress en fonction du contexte.

Vous allez apprendre à créer le header du site et à afficher des articles dans cette troisième leçon.

Le fichier functions.php

Le fichier functions.php permet d’ajouter ou utiliser des fonctionnalités existantes dans WordPress. Nous allons voir comment enregistrer un menu et comment faire pour ajouter une sidebar.

Affichage du menu et des sidebars dans le thème WordPress

Dans la précédente leçon, vous avez enregistré le menu et les sidebars dans le thème, nous pouvons maintenant afficher ces éléments dans le template. Nous allons notamment voir comment afficher une sidebar en pied de page et sur le côté de notre site.

Ajout du style à notre thème WordPress

Pour styliser notre thème WordPress, il ne reste plus qu’à ajouter des règles css dans le fichier style.css.

Résultat du tutoriel

C’est la fin de cette formation : « Comment créer un thème WordPress facilement ? ». J’espère qu’il vous a été utile pour apprendre les concepts de base de WordPress et pour réaliser votre premier thème.

Si vous avez des questions sur ce tutoriel WordPress ou que vous voulez laisser un petit mot n’hésitez pas à commenter ci-dessous !