Elementor : créer vos pages WordPress sans coder

Qu'est-ce qu'Elementor

Elementor est un plugin WordPress qui remplace l'éditeur natif par une interface visuelle de type glisser-déposer. Concrètement, vous voyez votre design se construire en temps réel sous vos yeux, comme dans un outil de mise en page grand public, mais sur votre propre site WordPress auto-hébergé. Vous n'avez ni HTML, ni CSS, ni PHP à écrire.

C'est aujourd'hui le constructeur de pages le plus utilisé au monde, avec plusieurs millions de sites actifs. Cette popularité a un double avantage pour le débutant : une documentation très fournie, en français comme en anglais, et une communauté capable de répondre à presque toutes les questions.

Elementor existe en deux versions. La version gratuite couvre déjà l'essentiel : une quarantaine de widgets, la mise en page complète et le responsive. La version Pro ajoute un constructeur de thème (en-têtes et pieds de page dynamiques), un constructeur de fenêtres surgissantes, l'intégration de boutiques en ligne et une bibliothèque de widgets bien plus large. Pour débuter un site vitrine, une page de présentation ou un portfolio, la version gratuite suffit largement.

Installer Elementor en quelques minutes

L'installation est rapide et ne demande aucune compétence technique. La méthode la plus simple passe directement par le tableau de bord de WordPress.

Ouvrez le menu Extensions

Connectez-vous à votre administration WordPress, à l'adresse votresite.fr/wp-admin. Dans le menu de gauche, déroulez « Extensions », puis cliquez sur « Ajouter une nouvelle extension ». Vous arrivez sur la bibliothèque officielle, depuis laquelle vous pouvez chercher et installer n'importe quel plugin gratuit.

Installez et activez Elementor

Dans le champ de recherche en haut à droite, tapez « Elementor Website Builder ». Le plugin officiel apparaît en tête de liste. Cliquez sur « Installer maintenant », patientez quelques secondes, puis sur « Activer ». Un court assistant de configuration s'ouvre : vous pouvez le suivre ou le passer, cela ne change rien à la suite.

Vérifiez l'intégration

Une fois Elementor activé, un nouveau menu « Templates » apparaît dans votre tableau de bord. Surtout, un bouton « Modifier avec Elementor » s'affiche désormais sur toutes vos pages et tous vos articles. C'est ce bouton qui ouvre l'éditeur visuel. Si vous le voyez, l'installation est réussie.

Créer votre première page avec Elementor

Le meilleur moyen de comprendre Elementor est de construire une page de A à Z. Voici la marche à suivre, étape par étape, pour une page simple de type « À propos ».

Créez une page et ouvrez l'éditeur

Dans le menu « Pages », cliquez sur « Ajouter une nouvelle page », donnez-lui un titre, puis cliquez sur « Modifier avec Elementor ». L'éditeur visuel se charge à la place de l'éditeur classique de WordPress.

Repérez l'interface

L'écran se divise en trois zones. À gauche, le panneau présente la bibliothèque de widgets et les réglages. Au centre, vous visualisez votre page en direct, telle qu'elle apparaîtra aux visiteurs. En bas du panneau, une barre d'outils donne accès à l'aperçu responsive, aux paramètres de la page, à l'historique des modifications et au bouton de publication.

Ajoutez une section

Au centre de la page vide, cliquez sur le bouton « plus » pour insérer une nouvelle section. Elementor vous propose alors de choisir une structure de colonnes : une seule colonne pour un bloc pleine largeur, deux ou trois colonnes pour répartir le contenu côte à côte. Sélectionnez la structure qui correspond à votre besoin et la section apparaît.

Glissez votre premier widget

Dans le panneau de gauche, repérez le widget « Titre », puis faites-le glisser dans votre section. Cliquez sur le titre pour en modifier le texte. L'onglet « Style » vous permet d'ajuster la taille, la couleur et l'alignement, tandis que l'onglet « Avancé » gère les marges, les espacements internes et les animations. Le principe est le même pour tous les widgets.

Complétez puis publiez

Continuez à empiler les widgets selon vos besoins : « Image » pour les visuels, « Éditeur de texte » pour les paragraphes, « Bouton » pour les appels à l'action, « Icône » pour des puces visuelles. Quand votre page vous convient, cliquez sur « Publier » en bas du panneau. Votre page est aussitôt en ligne.

Comprendre la structure sections, colonnes, widgets

Elementor organise chaque page selon trois niveaux hiérarchiques. Une fois ce principe assimilé, tout devient logique et vous construisez vos mises en page beaucoup plus vite.

La section est le conteneur principal, qui occupe toute la largeur de la page. Elle gère l'arrière-plan, les espacements globaux et la disposition d'ensemble. La colonne divise une section dans le sens horizontal : une section peut contenir une, deux, trois colonnes ou plus, côte à côte. Le widget, enfin, est l'élément de contenu lui-même : un titre, une image, un bouton, un formulaire, une icône.

Pour le résumer simplement : une page est une pile de sections empilées verticalement ; chaque section contient une ou plusieurs colonnes alignées horizontalement ; chaque colonne contient un ou plusieurs widgets empilés à la verticale. Cette logique d'emboîtement est la clé pour construire des pages claires et faciles à modifier.

Astuce de travail au quotidien : un clic droit sur n'importe quel élément, qu'il s'agisse d'une section, d'une colonne ou d'un widget, ouvre un menu contextuel. Vous y trouvez les actions essentielles : éditer, dupliquer, copier, coller, supprimer ou enregistrer comme modèle. C'est un gain de temps considérable une fois adopté.

Rendre votre design responsive

L'adaptation au mobile n'est plus une option. La majorité du trafic web provient désormais des smartphones, et Google évalue votre site à partir de sa version mobile. Une page parfaite sur ordinateur mais cassée sur téléphone vous coûtera des visiteurs et du référencement. Elementor intègre heureusement tous les outils nécessaires.

Dans la barre du bas de l'éditeur, une icône d'aperçu responsive vous permet de basculer entre trois formats : l'ordinateur, la tablette et le mobile. Vous visualisez immédiatement le rendu de votre page sur chacun de ces supports, sans quitter l'éditeur.

Pour chaque widget, la plupart des réglages de style disposent d'une petite icône responsive à côté du champ. Elle vous permet de définir une valeur différente selon l'appareil. Vous pouvez par exemple afficher un titre à grande taille sur ordinateur et le réduire automatiquement sur mobile, pour qu'il reste lisible sans déborder.

Enfin, l'onglet « Avancé » de chaque widget propose des options de visibilité par appareil. Vous pouvez masquer un élément sur mobile, ou au contraire le réserver au mobile. C'est pratique pour proposer deux versions adaptées d'un même bloc selon la taille de l'écran.

Gagner du temps avec les templates

Les templates, ou modèles, sont l'un des plus grands atouts d'Elementor pour les débutants. Plutôt que de partir d'une page blanche, vous insérez une mise en page déjà conçue, puis vous l'adaptez à votre contenu.

Dans une page Elementor, cliquez sur l'icône en forme de dossier, dans la zone d'ajout d'une section. La bibliothèque de templates s'ouvre. Elle se divise en deux onglets : les blocs, qui correspondent à des sections individuelles comme un en-tête ou une grille de tarifs, et les pages, qui proposent des mises en page complètes. Vous pouvez filtrer par catégorie, prévisualiser un modèle, puis l'insérer en un clic. Une centaine de modèles sont gratuits, et bien davantage avec la version Pro.

Vous pouvez aussi créer votre propre bibliothèque. Sur une section que vous avez soignée, un clic droit, puis « Enregistrer comme modèle », la sauvegarde sous le nom de votre choix. Vous la retrouverez ensuite dans vos modèles personnels, prête à être réutilisée sur d'autres pages. C'est la garantie d'une cohérence visuelle sur un site qui compte plusieurs pages.

Les erreurs de débutant à éviter

Quelques réflexes simples vous épargneront les pièges les plus fréquents et préserveront la rapidité de votre site.

Négliger la version mobile. Un design pensé uniquement pour l'ordinateur se retrouve souvent illisible sur téléphone. Vérifiez systématiquement le rendu mobile dans l'aperçu responsive avant de publier.

Surcharger une page de widgets. Elementor permet d'empiler des dizaines d'éléments, mais chaque widget alourdit la page et ralentit son chargement. Visez une mise en page sobre, avec un nombre raisonnable de widgets par page.

Oublier d'optimiser les images. Glisser des photos de plusieurs méga-octets rend une page très lente. Compressez vos images avant de les téléverser et privilégiez un format léger comme le WebP. Une page rapide est mieux référencée et plus agréable à consulter.

Coder du CSS sans nécessité. Elementor autorise l'ajout de code personnalisé, ce qui est tentant mais piégeux pour un débutant. Utilisez d'abord les réglages natifs, qui couvrent l'immense majorité des besoins, et réservez le CSS aux cas où il est vraiment indispensable.

Conclusion

Elementor est le constructeur de pages WordPress le plus accessible pour débuter en 2026. Vous concevez des pages soignées sans écrire de code, par simple glisser-déposer, et la version gratuite suffit largement pour lancer un projet personnel ou professionnel. La logique des sections, colonnes et widgets s'apprend en quelques heures, et les templates vous font gagner un temps précieux.

Apprendre Elementor par soi-même est tout à fait possible ; structurer cet apprentissage et construire un site complet, du nom de domaine au référencement, va plus vite avec un accompagnement. C'est précisément l'objet de notre formation WordPress : installation, mise en page avec Elementor, gestion du contenu et référencement, le tout 100% à distance et en live, avec un formateur dédié. Inscription immédiate, démarrage rapide et paiement en 3× sans frais. Pour aller plus loin, consultez aussi notre tutoriel Yoast SEO, notre guide pour gérer vos slugs et permaliens et notre sélection d'extensions WordPress essentielles.