Comment créer un Site WordPress de A à Z avec Elementor

Comment créer un Site WordPress de A à Z avec Elementor (Guide Complet)

Vous rêvez de créer un site WordPress professionnel sans toucher une ligne de code ? Que vous soyez entrepreneur, artisan, indépendant ou membre d’une association… ce guide complet est fait pour vous ! Dans ce tutoriel ultra détaillé, je vous montre étape par étape comment créer un site WordPress avec Elementor, l’un des meilleurs constructeurs de pages visuelles gratuits du marché. 🙌

De l’hébergement à l’installation, en passant par la création de vos premières pages, vous verrez qu’il est possible de bâtir un site esthétique et fonctionnel sans connaissance technique.

Prêt(e) à donner vie à votre projet ? Allez, on y va ! 😄

Étape 1 – Choisir le bon hébergement pour votre site WordPress

Créer un site web commence toujours par une bonne base. Et cette base, c’est votre hébergement web. C’est là où vivra votre site. Alors autant ne pas se tromper !

🌍 Les solutions recommandées

Dans cette vidéo, je vous recommande deux excellents hébergeurs testés et validés :

• Hostinger : Excellent rapport qualité/prix, hébergement sécurisé, nom de domaine offert, et surtout… une interface ultra simple pour les débutants.
• o2switch : Un hébergeur 100% français, avec des performances solides et un support technique basé en France. Parfait pour les structures plus exigeantes.

🖥️ Et si vous préférez travailler hors ligne avant de mettre votre site en ligne, LocalWP est un outil génial pour créer un site WordPress directement sur votre ordinateur, sans connexion internet continue.

💡 Astuce : Pour héberger votre site WordPress facilement et à petit prix, Hostinger est une solution idéale, rapide et sécurisée 👉 https://hostinger.fr/com64

Étape 2 – Installer WordPress et faire les premiers réglages essentiels

Une fois votre hébergement choisi et activé, place à l’installation de WordPress. Et rassurez-vous, c’est beaucoup plus simple que ce que vous imaginez… surtout avec Hostinger ou o2switch, qui proposent une installation en un clic ! 😎

🛠️ Installation de WordPress

Avec Hostinger, vous accédez à votre tableau de bord, vous sélectionnez « Créer un site », vous choisissez WordPress, et… magie ! En quelques minutes, vous êtes redirigé(e) vers l’interface d’administration WordPress, aussi appelée le back-office.

Pensez à bien enregistrer l’URL d’administration, souvent du type votresite.com/wp-admin.

⚙️ Les réglages de base à ne pas zapper

Avant toute création, quelques réglages sont à faire pour partir sur de bonnes bases :

• Titre du site & slogan : Donnez une identité claire à votre projet.
• Fuseau horaire et format de date : pour afficher les bonnes infos sur votre site.
• Réglages de lecture : vous choisirez ici votre page d’accueil (créée plus tard).
• Réglages des permaliens : très important pour le référencement. Sélectionnez « Titre de la publication » pour avoir des URL propres.

💡 Astuce : Réglez vos permaliens sur le format « Titre de la publication ». C’est l’un des meilleurs choix pour votre référencement naturel (SEO) !

🙈 Supprimer la barre d’administration

Petit détail esthétique : vous pouvez désactiver la barre d’administration visible quand vous êtes connecté(e). Pour cela :
Profil > décocher « Afficher la barre d’outils… » > Enregistrer. Et voilà !

Ces petits réglages prennent 5 minutes mais ils sont essentiels pour un site propre, rapide et SEO-friendly.

Étape 3 – Choisir et installer un thème compatible Elementor

Maintenant que votre WordPress est prêt, place à l’habillage de votre site ! 🎨
Et pour cela, on va choisir un thème WordPress qui s’accorde parfaitement avec Elementor.

🎯 Pourquoi un thème WordPress adapté est important ?

Un bon thème WordPress :

• Est léger et rapide à charger 🚀
• Est 100 % compatible avec Elementor
• S’adapte parfaitement aux mobiles (responsive)
• Permet une personnalisation simple et efficace

🌟 Le thème recommandé : Hello Elementor

Dans ce tutoriel, j’ai choisi le thème Hello. Pourquoi ? Parce qu’il est :

• Développé par l’équipe d’Elementor eux-mêmes
• Ultra-léger (presque vide), donc idéal pour construire vos pages de A à Z
• Compatible à 100 % avec toutes les fonctions d’Elementor

Mais si vous préférez un thème un peu plus “préconstruit”, vous pouvez aussi opter pour :

• Astra (flexible et rapide)
• OceanWP (riche en fonctionnalités)

🔧 Comment installer un thème WordPress

1. Allez dans Apparence > Thèmes
2. Cliquez sur Ajouter
3. Recherchez le thème “Hello” (ou “Astra”, “OceanWP” selon votre choix)
4. Cliquez sur Installer puis Activer

🧹 Petit conseil de ménage : supprimez tous les autres thèmes inutiles. Gardez uniquement le thème activé + un thème WordPress par défaut (comme Twenty Twenty-Three) en roue de secours.

💡 Astuce : Gardez toujours un thème natif WordPress activé en fond, en cas de bug avec votre thème principal. C’est votre “roue de secours” digitale !

Étape 4 – Personnaliser l’identité visuelle du site

Maintenant que votre thème est installé, il est temps de donner votre identité à votre site. C’est ici qu’on va ajouter le logo, le favicon (l’icône dans l’onglet du navigateur), et définir votre style graphique.

🎨 Où personnaliser votre site WordPress ?

Rendez-vous dans : Apparence > Personnaliser

Vous accédez à une interface simple qui vous permet de :

• Ajouter un logo
• Définir un slogan
• Ajouter un favicon
• Choisir les polices, les couleurs, les marges et plus encore

🖼️ Ajouter un logo et un favicon

1. Cliquez sur Identité du site
2. Téléversez votre logo
3. Téléversez votre favicon (image carrée, minimum 512x512px)
4. Désactivez le recadrage automatique si votre logo est déjà optimisé
5. Cliquez sur Publier

💡 Astuce : Utilisez des images optimisées (format WebP, poids < 100Ko) pour accélérer le chargement de votre site et booster votre référencement SEO.

🎨 Personnalisez les couleurs globales

Définissez votre charte graphique :

• Couleur de fond
• Couleur principale (boutons, liens…)
• Couleur de texte
• Couleur des titres

⚙️ Et pensez à enregistrer vos couleurs comme “couleurs globales” dans Elementor pour ne pas avoir à les saisir à chaque fois.

Étape 5 – Installer Elementor et créer vos premières pages

Maintenant que votre site a un nom, un logo et un thème tout propre, il est temps de passer à l’étape la plus créative : la construction des pages avec Elementor ! 🛠️✨

🔌 Installer Elementor (version gratuite)

Rien de plus simple :

1. Allez dans Extensions > Ajouter
2. Tapez “Elementor” dans la barre de recherche
3. Cliquez sur Installer puis Activer

Et voilà, Elementor est prêt à vous faire gagner un temps fou dans la création de vos pages.

🧱 Elementor est un Page Builder (constructeur de page) en glisser-déposer. Vous pouvez tout faire visuellement, sans écrire une ligne de code.

⚙️ Activer le conteneur Flex

Lors de la première utilisation, Elementor vous proposera d’activer le Flex Container.

💡 Astuce : Activez cette option. Elle permet de créer des mises en page plus rapides, plus légères, et plus flexibles, notamment pour les mobiles et tablettes.

🧩 Créer vos premières pages avec Elementor

1. Allez dans Pages > Ajouter
2. Créez une page d’accueil, par exemple
3. Cliquez sur Modifier avec Elementor
4. À gauche, utilisez les widgets disponibles : titre, texte, image, bouton, etc.
5. Vous pouvez partir d’une mise en page vide ou utiliser un modèle préconçu

💡 Astuce : Utilisez les blocs gratuits de la bibliothèque Elementor pour démarrer rapidement. Certains modèles sont déjà bien conçus et prêts à l’emploi.

📌 Pensez aussi à :

• Ajouter une image d’en-tête pour capter l’attention
• Intégrer un bouton d’appel à l’action (ex : “Contactez-nous”)
• Structurer votre contenu en sections claires

Étape 6 – Créer une page de connexion personnalisée

Créer une page de connexion sur son site WordPress, ce n’est pas obligatoire… mais c’est super pratique quand on veut éviter de taper à chaque fois une URL compliquée comme /wp-admin. Et avec Elementor et Forminator, c’est un jeu d’enfant ! 🔐

🧩 Installer Forminator

1. Allez dans Extensions > Ajouter
2. Recherchez Forminator
3. Cliquez sur Installer puis Activer

Forminator est une extension ultra complète pour créer :

• Formulaires de contact
• Quiz, sondages, devis
• Et ici… un formulaire de connexion !

🔐 Créer un formulaire de connexion

1. Dans le menu WordPress, allez dans Forminator > Formulaires
2. Cliquez sur Créer > Connexion
3. Personnalisez les champs (identifiant, mot de passe, bouton)
4. Ajoutez un lien « Mot de passe oublié ? »
5. Copiez le shortcode du formulaire

💡 Astuce : Ajoutez un reCAPTCHA v3 de Google pour protéger votre site des tentatives de connexion automatisées.

🧱 Intégrer le formulaire dans une page avec Elementor

1. Allez dans Pages > Ajouter, nommez-la « Connexion »
2. Collez le shortcode dans un widget “Code HTML” ou “Éditeur de texte”
3. Stylisez la page avec Elementor : centrer, espacer, ajouter un titre…

🎨 Pour un design plus propre :

• Créez une section centrée avec largeur fixe (500-600px)
• Ajoutez un fond clair et du padding
• Ajoutez votre logo pour renforcer votre branding

Et voilà ! Une page de connexion propre, personnalisée, et surtout accessible directement depuis le menu du site. Pratique, non ?

Étape 7 – Créer une page de contact efficace

Une page de contact, c’est souvent l’une des plus visitées de votre site. Elle doit donc être claire, rassurante et fonctionnelle. Grâce à Elementor et Forminator, on peut faire ça facilement et avec style ! 💌

🧩 Créer un formulaire de contact avec Forminator

1. Allez dans Forminator > Formulaires
2. Cliquez sur Créer > Contact
3. Ajoutez les champs utiles :
   • Nom
   • Prénom
   • Email
   • Téléphone
   • Message
   • (optionnel) Téléversement de fichier 📎
4. Personnalisez l’apparence si besoin
5. Copiez le shortcode

💡 Astuce : Proposez à vos prospects de téléverser un fichier (ex. cahier des charges, devis, etc.) pour gagner en efficacité lors du premier échange.

📄 Créer la page Contact dans WordPress

1. Allez dans Pages > Ajouter, nommez-la “Contact”
2. Cliquez sur Modifier avec Elementor
3. Ajoutez une section 2 colonnes :
   • À gauche : titre, texte de bienvenue, horaires, adresse
   • À droite : le widget Éditeur de texte contenant le shortcode du formulaire

🗺️ Ajouter une carte Google Maps

Pour renforcer la crédibilité et aider vos visiteurs à vous situer :

1. Ajoutez un widget Google Maps dans une section
2. Renseignez votre adresse
3. Supprimez les effets de filtre noir et blanc si besoin (dans les réglages de style)

🎨 Bonus design :

• Utilisez les couleurs globales définies précédemment
• Ajoutez des icônes (téléphone, mail, carte) pour rendre la page plus vivante
• Gardez une structure aérée et responsive (adaptée mobile)

Et voilà, votre page de contact est maintenant esthétique, fonctionnelle et engageante !

Étape 8 – Finaliser votre site avec un design professionnel

Votre site commence à prendre forme ? Bravo ! 🎉

Maintenant, il est temps de lui donner un aspect professionnel et harmonieux. Et là encore, Elementor est votre meilleur allié.

🧭 Créer un menu de navigation

1. Allez dans Apparence > Menus
2. Créez un nouveau menu appelé “Menu principal”
3. Ajoutez vos pages (Accueil, Connexion, Contact…)
4. Attribuez ce menu à l’emplacement “En-tête”

🧑‍💻 Vous pouvez aussi créer un second menu pour le pied de page avec les mentions légales, politique de confidentialité, etc.

🎨 Personnaliser l’en-tête et le pied de page

Dans Apparence > Personnaliser, vous pouvez :

• Centrer le logo ou le redimensionner
• Modifier la disposition du menu
• Changer la couleur de fond
• Personnaliser les polices et la taille du texte

💡 Astuce : Enregistrez vos couleurs comme “Couleurs Globales” pour les réutiliser partout dans Elementor. Gain de temps garanti !

🖌️ Styliser les pages avec Elementor

Voici quelques bonnes pratiques :

• Utilisez des sections aérées avec des marges internes (padding)
• Limitez le nombre de polices à 2 (une pour les titres, une pour le texte)
• Ajoutez une ombre légère aux titres ou images pour un effet pro
• Vérifiez la compatibilité mobile depuis l’icône de responsive dans Elementor

🎯 Objectif : une expérience fluide, agréable et cohérente pour l’utilisateur.

🧹 Nettoyer l’interface d’administration

Dans le Tableau de bord WordPress, cliquez sur Options de l’écran et décochez les blocs inutiles. Ça allège votre espace de travail !

Étape 9 – Sécuriser et sauvegarder votre site WordPress

Créer un beau site, c’est bien. Le protéger et le sauvegarder, c’est encore mieux ! 🔐

Un site non sécurisé, c’est comme une maison sans serrure. Et un site sans sauvegarde, c’est comme un ordinateur sans bouton « Annuler »… 😅

💡 Astuce : Facilitez la création de votre Boutique en ligne en prenant des sessions d’accompagnement et de coaching pour être accompagné, pas à pas dans le développement de votre Site e-Commerce. Profitez des conseils et des recommandations d’un expert qui répond à toutes vos problématiques : Boutique en ligne, Référencement SEO, Gestion des Réseaux Sociaux, Stratégies Marketing, Création Graphique.

🛡️ Protéger votre site WordPress

Voici quelques actions simples mais essentielles :

• Activer le certificat SSL (https) via votre hébergeur
• Changer l’URL de connexion avec une extension de sécurité (ex. WPS Hide Login)
• Limiter les tentatives de connexion avec des plugins comme Limit Login Attempts Reloaded
• Installer un plugin de sécurité comme Wordfence ou iThemes Security

💡 Astuce : Activez l’option Google reCAPTCHA sur vos formulaires de contact et de connexion pour bloquer les robots et tentatives malveillantes.

💾 Sauvegarder votre site WordPress

Rien de plus stressant que de perdre tout son site après une mise à jour qui tourne mal. D’où l’importance d’avoir une sauvegarde automatique.

Extensions WordPress recommandées :

• WPVivid (très simple à configurer et pratique pour les migrations complètes))
• Presto Player (pratique intégrer des vidéos dans votre site)

📌 Configurez des sauvegardes :

• Hebdomadaires pour un site vitrine
• Quotidiennes pour un site e-commerce ou très actif

💡 Astuce : Programmez une sauvegarde automatique et stockez-en une copie sur Google Drive ou Dropbox. On n’est jamais trop prudent !

Pour finir, je dirais que…

Créer un site WordPress de A à Z avec Elementor, c’est accessible à tous – que vous soyez entrepreneur, artisan, indépendant ou membre d’une association. Avec les bons outils (Hostinger, Elementor, Forminator) et une méthode étape par étape, vous pouvez bâtir un site pro, rapide et adapté à vos besoins sans écrire une seule ligne de code. 💪

Dans ce guide, vous avez appris à :

• Choisir le bon hébergement
• Installer et configurer WordPress
• Créer des pages avec Elementor
• Intégrer des formulaires puissants
• Personnaliser votre site à votre image
• Sécuriser et sauvegarder votre site comme un pro

Maintenant, c’est à vous de jouer ! 🎯

🔔 Continuez l’aventure avec moi !

➡️ Abonnez-vous à ma chaîne YouTube pour ne pas rater mes prochains tutoriels, astuces WordPress et conseils marketing, en cliquant sur le lien suivant :
👉 Je m’abonne à la chaîne Cedric – COM 64

📩 Envie de recevoir mes meilleures ressources directement dans votre boîte mail ?
Inscrivez-vous à la newsletter et recevez mes guides exclusifs, astuces SEO et nouveautés WordPress.

✉️ Je m’abonne à la Newsletter

👉 Et vous ? Comment avez-vous réalisé votre site WordPress avec Elementor ?