Épisode 1 : Construis ton site simplement avec Elementor
Bienvenue dans Le Labo ! Aujourd’hui, on va faire simple : on construit une page propre, jolie et efficace sur WordPress avec Elementor, sans prise de tête.
À la fin de cet épisode, tu sauras lancer Elementor depuis WordPress, comprendre la logique Section/colonnes/widgets, créer un bloc “Hero” (avec un titre, un texte, un bouton et une image), et ajouter du style à ta page grâce à l’espacement, la typographie et les couleurs.
Avant de commencer, vérifie juste ça :
✅ WordPress installé
✅ Elementor activé
✅ Tu as accès à ton menu WordPress
Etape 1 : Si Elementor n’est pas installé (la base de la base)
1) Va dans ton WordPress
➡️ Plugin → Ajouter
2) Cherche “Elementor”
Dans la barre de recherche, tape :
✅ Elementor Website Builder
3) Installer puis Activer
Clique sur :
✅ Installer maintenant
puis
✅ Activer
Cette étape est indispensable : sans Elementor installé et activé, tu ne pourras pas modifier tes pages en mode visuel.
Étape 2 : Créer ta page recette (on pose les fondations)
1) Ajoute une nouvelle page
Dans ton WordPress :
➡️ Pages → Ajouter une page
2) Donne un titre à ta page
Par exemple :
✅ Recette gâteau au chocolat
3) Publie ta page
Clique sur :
✅ Publier
Créer ta page dès maintenant te permet d’avoir une structure claire avant de passer sur Elementor.
Étape 3 : Passer en mode édition Elementor (on lance la construction)
Tu es déjà sur ta page “Recette : Gâteau au chocolat” après l’avoir publiée : parfait.
1) Clique sur Modifier avec Elementor
Normalement tu vois le bouton en haut.
✅ Modifier avec Elementor
Cette étape te permet de commencer la mise en page directement en visuel, avec un rendu clair et instantané pendant que tu construis ta recette.
Étape 4 : Découvrir l’interface Elementor (prendre ses repères)
Une fois Elementor ouvert, tu vas voir 2 zones principales :
1) À gauche : le panneau Elementor
C’est ici que tu retrouves :
- les widgets (titre, image, liste, bouton…)
- les onglets Contenu / Style / Avancé
- les réglages de ta page
2) À droite : l’aperçu de ta page
C’est là que tu construis ta recette en direct, et que tu vois le rendu immédiatement.
Étape 5 : Ajouter la structure : Section → Colonnes (on prépare la mise en page)
Avant d’ajouter le contenu de ta recette, on crée la structure de base.
1) Ajoute une nouvelle section
Sur la page, clique sur le + puis Flexbox
2) Choisis une structure en 2 colonnes
Colonne gauche : texte (titre + intro + bouton) Colonne droite : image du gâteau
Quand tu ajoutes une nouvelle section dans Elementor, tu peux avoir le choix entre :
Flexbox ou Grille (Grid)
Choisis Freebox, car c’est le plus simple pour construire une page classique.
Flexbox te permet de :
- créer facilement une mise en page en 2 colonnes
Grille / Grid (utile mais pas pour ce tuto)
La Grille est plus adaptée quand tu veux une structure très “cadrée” :
- une galerie d’images
- des cartes produits
Étape 6 : Créer le Hero de ta recette (le bloc principal)
✅ Colonne gauche : le texte
Ajoute ces widgets :
Titre
Gâteau au chocolat fondantÉditeur de texte
Une courte phrase d’intro, par exemple :
“Une recette simple, rapide et ultra gourmande, parfaite pour un dessert chocolaté.”Bouton
Texte : ✅ Voir la recette
Lien : tu peux mettre#ingredients
✅ Colonne droite : l’image
Ajoute :
Image
➡️ Une photo du gâteau au chocolat
Maintenant que ta section en 2 colonnes est prête, on va remplir le haut de page avec les infos principales de la recette.
Étape 7 : Ajouter la section “Ingrédients” (le cœur de la recette)
Maintenant que ton Hero est terminé, on passe au contenu principal : les ingrédients.
1) Ajoute une nouvelle section
Sous ton Hero, clique sur +
✅ Choisis 1 colonne (simple)
2) Ajoute un titre
Glisse le widget Titre et écris :
📌 Ingrédients (pour 6 personnes)
3) Ajoute la liste des ingrédients
Glisse le widget Éditeur de texte et écris par exemple :
- 200g de chocolat noir
- 100g de beurre
- 3 œufs
- 80g de sucre
- 50g de farine
Étape 8 : Ajouter la section “Préparation” (les étapes à suivre)
Maintenant qu’on a les ingrédients, on ajoute la partie la plus importante : comment réaliser la recette. Ici, on refait exactement la même logique que l’étape précédente, mais avec un nouveau contenu (c’est volontaire : c’est comme ça qu’on construit une page complète section par section).
1) Ajoute une nouvelle section
Sous la section Ingrédients, clique sur +
✅ Choisis 1 colonne
2) Ajoute un titre
Glisse le widget Titre et écris :
📌 Préparation
3) Ajoute les étapes de la recette
Tu peux utiliser un widget Éditeur de texte.
Exemple :
- Préchauffe le four à 180°C
- Fais fondre le chocolat + beurre
- Ajoute le sucre puis les œufs
- Incorpore la farine
- Verse dans un moule et enfourne 20 min
Étape 9 : Ajouter du style à ta page (le glow up final)
Maintenant que ta recette est complète, on va lui donner un rendu plus pro et plus agréable à lire.
1) Ajouter de l’espace (padding)
Clique sur une section (cadre)
➡️ Avancé → Rembourrage (Padding)
Tu peux mettre : 20/20/20/20
2) Harmoniser la typographie
Clique sur tes titres, le texte et le bouton → onglet Style
Tu peux ajuster :
✅ la taille
✅ la graisse
✅ la couleur
✅ la police
✅ l’alignement
Étape 10 : Vérifier l’affichage et publier (derniers ajustements)
Maintenant que ta page est terminée, on fait une petite vérification rapide avant de la publier.
1) Mettre à jour / publier
En bas à gauche d’Elementor, clique sur :
✅ Mettre à jour (ou Publier)
2) Prévisualiser la page
Clique sur :
👁️ Aperçu
Vérifie :
✅ que tout est bien aligné
✅ que les espaces ne sont pas trop grands
✅ que le texte reste lisible
✅ que l’image ne déborde pas
Avec ces étapes, tu as construit une page recette complète et agréable à lire. Le plus important est de garder une structure simple, cohérente et bien espacée : c’est ce qui donne tout de suite un rendu plus professionnel.
Si ce tuto t’a aidé, pense à t’abonner à la chaîne YouTube Le Labo pour ne pas rater les prochains épisodes.
