L'auteur.
Maxime Boudin, consultant web et Media Buyer. Expert SEO – SEA. Auteur du blog marketing digital On-me-trouve.fr, conseil en création de site web et référencement.
Les publications récentes.
Articles récents
Les catégories du blog.
Nos services
Les sites d'intérêt.
Littérature
Comment faire un site WordPress avec Astra et Elementor
- Le Blog
- /
- Comment faire un site WordPress avec Astra et Elementor
Astra thème et Elementor builder pour WordPress : LA solution idéale
Aujourd’hui on va apprendre comment faire un site WordPress avec Astra et Elementor. C’est selon moi et à l’heure actuelle LA solution idéale, rapide et économique pour disposer d’un site WordPress complet et efficace. Les points forts de cette combinaison : la simplicité de prise en main et les possibilités de personnalisation gratuite infinies offrant un pack adapté à la majorité des besoins du web.
Faire un site WordPress avec Astra
Astra est le template qui détermine le thème graphique du site, l’apparence générale, embarquant par défaut toute une série de fonctionnalités qui couvrent aussi bien les besoins des sites vitrines que ceux des boutiques en ligne. Par exemple, et selon le modèle de départ choisi, on peut disposer de l’intégration immédiate d’un panier d’achat pour son e-commerce grâce à l’installation automatique de WooCommerce sans recourir à un développement supplémentaire, ou on a droit à un paramétrage responsive simplifié pour tablettes et mobiles ce qui est très pratique et très important au regard de l’importance de l’usage de ces supports de nos jours.
Construire ses pages avec Elementor
Elementor pour sa part est un constructeur de pages, il permet de personnaliser très facilement ses pages selon des lignes de blocs texte, image, vidéo, icône, etc… pleine page, deux colonnes, trois colonnes ou plus. Dupliquer, déplacer en un clic… Changer une couleur ou une image de fond. C’est l’idéal pour faire de la mise en page comme on veut et en un clin d’oeil. Il offre un rendu clair, organisé et agréable à lire.
1. Installer le template Astra pour WordPress
Installer le template Astra pour WordPress est relativement simple et cela fonctionne comme pour n’importe quel autre template.
- Dans le menu Apparence
- Sous-menu Thèmes
- Bouton du haut « Ajouter un thème »
- Taper « Astra » dans le champ de recherche en haut à droite « Rechercher des thèmes » puis taper sur entrée
- Dans la liste des résultats, choisir « Astra », installer et activer.
Une fois que ces étapes sont validées, on obtient cet affichage à l’écran, indiquant qu’Astra est bien installé et activé. Cela suffit à proposer de premières options de personnalisation du site mais pour gagner du temps et obtenir un aspect visuel plus professionnel, on va se baser sur une démo déjà existante du template Astra grâce aux « Starter Templates » ou modèles de démarrage Astra, et venir la modifier ensuite selon le besoin.
Capture d’écran de l’espace d’administration de WordPress qui montre qu’Astra a été installé.
2. Installer les modèles de démarrage Astra pour WordPress
Installer les modèles de démarrage Astra pour WordPress est très facile.
- Dans le menu en haut à gauche cliquer sur Astra
- Cliquer sur le 3e onglet Modèles de Démarrage
- Installer & Activer.
Capture d’écran de l’espace d’administration de WordPress affichant les modèles de démarrage Astra.
- Dans la fenêtre qui s’ouvre, on a le choix entre construire un site aidé de l’IA ou les modèles de démarrage classiques. Ici on va « Construire avec des modèles ».
- Choisir le constructeur de pages Elementor.
- Une liste de Démos apparait à l’écran. Choisir le modèle gratuit qui se rapproche du résultat souhaité en cliquant dessus. Cela permettra de gagner du temps dans la construction du site WordPress, sachant qu’on pourra par la suite modifier tout ce dont on a besoin, polices de caractères, couleurs, page d’accueil, etc…
Capture d’écran de l’admin WordPress affichant les démos dans modèles de démarrage Astra.
- De premières options de personnalisation d’Astra apparaissent : c’est l’occasion de commencer à ajouter un logo, à choisir un jeu de caractères ou encore un jeu de couleurs dominantes. Tout cela peut également être réglé ultérieurement.
- Sur l’écran suivant, choisissez les fonctionnalités souhaitées pour votre site WordPress. A minima le constructeur de pages, le reste selon les besoins. L’étape peut aussi être passée et tout cela pourra faire l’objet de réglages ultérieurs.
- Sur les messages suivants, choisir « Passer et continuer » au besoin et finalement « Soumettre et construire mon site web ».
Et voilà ! Votre site et son nouveau design (de base) sont prêts. On va maintenant pouvoir passer à la construction de page WordPress avec Elementor.
3. Modifier une page avec Elementor pour WordPress
Comment modifier une page avec Elementor pour WordPress ? Pour modifier une page existante, maintenant qu’on a installé Astra et les modèles de démarrage d’Astra pour Elementor, il suffit de se rendre dans le menu Pages et de survoler le nom de page qu’on souhaite travailler pour faire apparaître les options d’édition de la page. Cliquer sur « Modifier avec Elementor ».
Capture d’écran de l’admin WordPress pour modifier une page existante
De façon générale, Elementor offre une série d’options intuitives très pratiques pour régler sa mise en page WordPress. Le grand panneau latéral de gauche propose systématiquement 3 onglets pour chaque objet de la page :
- Contenu
- Style
- Avancé
Avec ces options, on peut réaliser tout ce qu’on veut… ou presque. L’onglet contenu est propre à chaque objet, texte ou image, et sert à régler directement ce qu’on intègre dans la page.
L’onglet style va permettre d’opérer des modifications de tailles, d’alignement, de couleurs, d’opacité…
L’onglet avancé propose quant à lui des options plus poussées de marges, alignement et ordre d’affichage pour finaliser la mise en page de l’objet.
Capture d’écran de l’éditeur de page avec Elementor pour WordPress
Le menu principal horizontal sur fond noir permet d’ajouter des élements de base à la page, de procéder à des réglages du site WordPress ou de la page en cours d’édition, d’en changer l’aperçu pour pc, mobile ou tablette, de switcher et ainsi passer d’une page à l’autre. Au total, on peut modifier, ajouter, dupliquer, supprimer chaque élément de la page, changer un fond, intégrer une vidéo, une image… Pour bien comprendre les différentes options et bien les maîtriser, encore faut-il s’y essayer ! C’est parti ! On oublie pas de sauvegarder son brouillon ou de publier sa page quand on a fini.
Cet article vous a plu ? Abonnez-vous à la newsletter pour rester informé(e) des dernières astuces et nouveautés.
