Vous êtes débutant et vous voulez créer un site Internet ?
Vous voulez utiliser WordPress, mais vous ne savez pas comment ça marche ni comment faire ?
Dans ce tutoriel formation WordPress, je passe en revue 7 choses à faire et à connaître pour bien débuter avec ce CMS. Ces 7 étapes vous permettront de mieux comprendre comment procéder dans la réalisation de votre site Web WordPress.
1) WordPress qu’est-ce que c’est ?
WordPress est un CMS (content management system) c’est-à-dire en français un système de gestion de contenu. C’est un formidable outil qui va vous permettre de faciliter la gestion de votre contenu et de l’exposer en développant un site Internet facilement sans avoir besoin de vous y connaître en programmation.
Aujourd’hui WordPress représente plus de 40% des sites Internet de la toile, c’est donc un outil très populaire accessible à tous qui a vraiment démocratisé la création de site web qui désormais n’est plus réservé seulement aux développeurs.
Petite précision, WordPress est un logiciel open-source sous licence GPLv2, ce qui signifie que tout le monde peut l’utiliser ou le modifier gratuitement.
Il y a plusieurs années, WordPress était essentiellement un outil pour créer un blog, plutôt que des sites Internet classiques. Ceci n’est plus vrai aujourd’hui. Pour prendre une image, à la base WordPress est déjà une construction très complète qui permet une belle variété de sites. Mais ce qui en fait sa force c’est son système de plugins que l’on peut comparer à des briques qui vont encore agrandir cette construction et vont permettre à WordPress de devenir de plus en plus adapté et performant selon les besoins.
Prenons 1 exemple, vous voulez faire du e-commerce et bien il vous suffit d’installer en quelques clics le plugin WooCommerce pour transformer votre site WP de base en e-boutique performante. Bref vous l’aurez compris aujourd’hui avec WordPress vous pourrez créer tout type de site Web.
Encore une petite précision, pour que votre site WordPress soit visible, vous devrez l’installer sur un espace serveur que vous aurez souscrit chez un hébergeur. Ainsi votre site sera en ligne et vous pourrez le voir depuis votre ordinateur mais aussi depuis n’importe quel autre ordinateur dans le monde et ce grâce à Internet. Vous pourrez également depuis votre ordinateur administrer votre site situé sur le serveur de votre hébergeur et lui apporter des modifications.
WordPress a 2 facettes une publique qui est le site web lui même exposé à la vue de tous et accessible via un nom de domaine qui est l’URL du site. (https://votre-nom-de-domaine.fr)
Et une autre facette qui est la facette privée du site WordPress toujours accessible via l’adresse du nom de domaine à la quelle par défaut il faut ajouter admin ou login. Par là, je vais arriver sur la page de mon interface administrateur de WordPress.
A partir de mon tableau de bord WordPress, je vais pouvoir modifier mon contenu et créer des pages. Une fois mon travail terminé un peu à la manière d’une page Word, je cliquerai sur « Enregistrer et publier » et mon site modifié sera en ligne.
2) Quelles sont les différences entre wordpress.com et wordpress.org ?
Alors quand on a un peu entendu parler le WordPress et que l’on souhaite faire son site web. On fait quelque recherches et on tombe la plupart du temp sur 2 sites. WordPress.com et WordPress.org Alors, vers quel site s’orienter ?
ePSpontanément, on a tendance à aller sur wordpress.com. Il faut savoir que wordpress.com est un site qui va proposer des services payants à base du logiciel WordPress mais aussi en vous proposant un hébergement, c’est-à-dire un espace serveur qui va vous permettre d’installer WordPress afin que votre site soit en ligne.
WordPress.com offre plusieurs formule avec différentes options mais à moins de prendre la formule la plus chère qui s’élève à 59€ par mois en facturation mensuelle, vous aurez dans les autres cas des versions limitées de WordPress qui ne vous offrirons pas la pleine puissance de cet outil.
En revanche, si vous vous orientez vers la version de wordpress.org, vous aurez accès à la version complète de WordPress vous offrant toutes les options disponibles. De plus, cette version complète est gratuite. Mais vous n’aurez pas ici d’hébergement.
Si vous en avez les compétences, vous pouvez télécharger WordPress à cet endroit puis l’installer sur le serveur de votre choix. Mais ce qui est bien plus simple de faire et moins onéreux. C’est de souscrire à un abonnement chez hébergeur qui vous offrira une installation en automatique de la version complète de WordPress celle de chez wordpress.org.
De plus, à possibilités égales, un WordPress complet de wordpress.org installé chez un hébergeur se révélera moins cher que la formule complète de wordpress.com
Bref en conclusion, si vous voulez vraiment posséder votre site web, WordPress.org est vraiment la meilleure des solutions.
3) Où et comment installer WordPress ?
Si vous avez bien suivi mes conseils vous avec choisi l’option 2, celle d’une formule gratuite et complète de WordPress celle de wordpress.org.
Avant d’installer WordPress, il est nécessaire d’avoir un espace sur un serveur, c’est ce que vont nous proposer les hébergeurs.
L’offre d’hébergements en France et dans le mode est extrêmement vaste et complexe. De nombreux hébergeurs et formules existent et il est souvent très difficile de s’y retrouver surtout si on est débutant. D’autant plus qu’en therme de tarif, sérieux et fiabilité, ils sont loin d’être tous équivalents.
Dans cette vidéo d’explications et de conseil, je vais vous parler en connaissance de cause en vous faisant part de ma propre expérience et je vais vous recommander mon hébergeur chez qui je suis depuis maintenant 3 ans. Il s’agit de la société O2switch, société francaise que je connais bien et qui me donne entière satisfaction au quotidien, Ils ont une offre unique à 5€ HT/mois en illimité très performante avec un nom de domaine au choix compris Je vous rappelle que le nom de domaine c’est l’adresse à laquelle vous pourrez trouver votre site ex : monsite.fr , à cela vous ajoutez un excellent service clientèle et vous obtenez selon moi, un des meilleurs hébergeurs actuellement sur le marché. Une fois que vous aurez complété votre formulaire d’inscription et choisi votre nom de domaine, vous recevrez un email avec un lien vous donnant accès à votre CPanel qui est une interface qui vous permettra d’installer WordPress en quelques clics et ce de manière complètement automatisée.
A ce sujet, je vous recommande de regarder ma vidéo où je vous guide pas à pas dans votre inscription chez o2switch et dans l’installation de votre site WordPress. Il suffit d’observer et de vous laisser guider, je vais très doucement et vous y arriverez sans problème. :)
4) Présentation rapide de l’interface administrateur de WordPress
Je vous décrire ici de manière simplifiée les principales foncions de cette interface administrateur.
A) Tableau de bord
En partant du haut nous avons « Tableau de bord » C’est là que vous pourrez avoir en 1 d’œil sur certaines informations, état de santé du site, le site fenêtre de bienvenue etc.. Vous pourrez l’organiser comme vous le souhaiter en cliquant sur « option d’écran » en cochant ou décochant les cases. Il est également possible de déplacer ces encarts par « glisser / déposer ».
B) Articles
En dessous, vous avez « Articles », c’est ici que vous écrirez des articles destinés à alimenter un blog, si vous décidez d’en créer un. Je vous rappelle qu’un blog est une page, un journal qui vous permet de publier des posts c’est-à-dire des articles avec du texte, des photos ou des vidéos et de façon souvent assez régulière. Si vous le souhaitez, vos lecteurs pourront réagir en écrivant un commentaire au bas de la page. Si vous ne souhaitez pas réaliser blog, cette section restera inutilisée.
C) Médias
En dessous, vous avez « Médias » avec la médiathèque. C’est ici que seront consignés toutes les images, fichiers audio et éventuellement les vidéos qui serviront à la création de votre site. Vous pourrez les importer depuis votre ordinateur en cliquant sur ajouter.
D) Pages
En dessous, vous avez « Pages ». C’est à partir de là que vous nommerez et créerez les pages de votre site.
E) Commentaires
En dessous, nous avons « Commentaires ». C’est ici qu’apparaitront les commentaires laissés par les lecteurs sous les articles de votre blog. Vous pourrez ainsi choisir de les valider ou pas. Si vous les validez, ils apparaitront au bas de la page de votre article de blog.
F) Apparences
Puis en dessous nous avons « Apparences », pour simplifier, ici je vous parlerai de 2 choses :
-
Les Thèmes
Pour réaliser votre site WordPress, vous aurez besoin de choisir un thème. Le thème WordPress va gérer l’affichage de vos contenus via un template c’est-à-dire un gabarit.
Pour schématiser, Le thème va définir comment sont affichés et quelles sont les options disponibles pour votre page il y a :
- L’entête (header) qui contiendra en général le logo, le menu
- Le corps de la page avec le contenu principal
- La barre latérale (parfois présentent dans les blogs ou les sites de e-commerce).
- Le pied de page (footer) avec le menu de bas de page et les liens légaux (mentions légales, politique de confidentialité) etc.
Le thème sera la colonne vertébrale de votre site, il va configurer son apparence et sa structure. Pour faire simple vous pourrez trouver 3 types de thème :
– Vous avez des thèmes gratuits, ils sont nombreux, mais il faut faire attention, car certains sont de qualité médiocre.
– Il y a aussi des thème appelée Freemium. Le thème est gratuit, mais dispose soit d’une version payante avec plus d’options qui permettent d’étendre les fonctionnalités. Il y en a beaucoup dans la page galerie de WordPress.
– Mais il existe aussi des thèmes premium. Il s’agit de thèmes payants. Ils ne sont pas présents dans cette galerie WP, mais il est possible d’en acheter via des sites dédiés. Un des plus connu est le site Themeforest qui regroupe des milliers de thèmes premium !
Pour installer un thème rien de plus simple, s’il est dans la galerie, il suffit de cliquer sur installer puis activer. S’il n’est pas dans la galerie, ce qui sera le cas d’un thème premium, une fois que vous l’aurez acheté, il suffira de cliquer en haut sur « téléverser un thème » pour l’appeler et ensuite l’installer.
Mais pas de précipitation car dans l’étape suivante de ce tutoriel, je vous présente un formidable outil qui va vraiment vous aider à créer vos page WordPress et qui possède déjà son thème.
-
Menus
C’est ici que vous allez pouvoir définir et créer votre menu, en choisissant les pages qui y paraitront et en définissant leur ordre.
G) Extensions
La rubrique suivante, c’est la partie « Extensions » (plugins en anglais), l’image des briques dont je vous parlais pour décupler la puissance de WordPress c’est ici que ça se passe ! Il y a des milliers de plugins gratuits ou payants à installer en quelques clics selon vos besoins.
Précédemment, je prenais l’exemple de WooCommerce le plugin qui permet de transformer votre site WordPress en boutique Internet, il suffit d’inscrire son nom et de lancer une recherche. De plus cette extension est gratuite. La voici et il me suffit de cliquer ici pour l’installer puis de cliquer sur activer!
F) Comptes
Ensuite en dessous, nous avons « Comptes ». C’est ici que sont gérés les comptes des personnes qui administrent ou utilise le site, il est possible d’en créer plusieurs pour donner l’accès à cette interface à d’autres personnes avec des rôle, des droits équivalents ou moindres.
G) Outils
En dessous, nous avons « Outils« , nous n’entrerons pas dans le détail, c’est là que vous pourrez par exemple importer ou exporter des éléments du site.
H) Réglages
Et enfin « Réglages », avec ici tous les réglages disponibles au bon fonctionnement de WordPress et à régler selon votre goût.
5) Pourquoi installer un Page Builder ?
Pour créer une page, il faut aller dans le menu « pages », un fois la page créée, il possible de l’éditer avec l’éditeur de base de WordPress nommé Gutemberg.
Avec cet éditeur fournit avec WordPress on y arrive tant bien que mal mais il n’offre pas du tout le confort ni les possibilités ni la finesse de design que pourrait offrir un Page Builder Visuel.
Alors qu’est-ce que c’est qu’un Page Builder Visuel ?
Un Page Builder Visuel peut se traduire en français par constructeur de pages visuel. C’est un composant, une extension (plugin) qui va être ajoutée à WordPress et qui va vous permettre de créer des pages au design avancé en “glisser-déposer” et d’apporter des modifications sur la page telle qu’elle se présentera aux visiteurs.
Le Page Builder dispose d’une bibliothèque de modules (slider, appel à l’action, bouton, etc.) et facilite la construction de pages complexes et design sans avoir à coder.
Pour en revenir à Gutemberg cet éditeur de base de WordPress, ce n’est pas un véritable Page Builder, ce qui est assez limitant. Il est moins intuitif et convivial.
La structure en section, rangées avec les colonnes et le système du Glisser-Déposer des Page Builder manquent vraiment. Ici on ne peut déplacer les blocs uniquement qu’à l’aide des flèches ce qui est moins pratique. Les modules manquent de personnalisation. On peut leur apporter trop peu de style pour atteindre facilement un design efficace.
Et enfin cet éditeur ne nous permet pas, pour le moment de faire des modifications directement depuis une page en ligne. On ne peut donc pas voir en direct les modifications apportées au site ce que la plupart des Pages Builder proposent.
Il existe plusieurs Page Builder Visuels sur le marché : Elementor, Divi, Brizy etc.
Les 2 plus célèbres sont Elementor et Divi leur performances sont à peu près équivalentes.
Cependant mon choix penchera plutôt pour le Page Builder Visuel Divi de chez elegant Theme qui sera moins à la longue cher offre car ce sont les seules qui offre une formule avec une licence et un support à vie. Cette licence à 249$ vous permettra en plus de réaliser un nombre de sites illimités pour vous, vos amis ou vos clients. Si vous voulez simplement l’essayer vous pouvez choisir une licence pour un an à 89$ qu’il faudra renouveler.
Par mon mon lien affilié qui vous pourrez bénéficier d’une réduction -20% sur ces 2 formules.
Je pense que ce lien est toujours fonctionnel. Si ce n’était pas le cas, voici un autre lien classique pour Divi par lequel vous ne paierez pas plus cher que le prix officiel, mais qui me motivera à continuer de vous présenter des tutoriels !
Vous allez voir Divi est vraiment un outil fantastique qui va vraiment vous faciliter la vie sous WordPress. Il va vous permettre de créer un site web au design poussé en utilisant des modules simples et adaptés. Et surtout vous allez pouvoir travailler visuellement par glisser – déposer.
6) Installer Divi, le Page Builder Visuel
Un fois que vous aurez acheté votre licence Divi, vous aurez accès à votre espace client chez Elegant Themes et vous pourrez télécharger Divi.
2 formules sont téléchargeables, soit vous téléchargez uniquement le Page Builder soit vous téléchargez, le thème Divi + le Page Builder.
Dans notre tutoriel, nous téléchargerons le thème Divi + le Page Builder. En cliquant sur cette option, vous téléchargerez un fichier Divi.zip
Ensuite, retournez dans votre interface administrateur de WordPress, puis choisissez dans le menu de gauche choisissez « Apparence » puis « Thèmes » puis cliquez en haut sur « Ajouter » puis sur « Téléverser un thème » et appelez le fichier Divi.zip que vous venez de télécharger depuis chez Elegant Themes. Une fois le thème Divi installé, activez-le.
Petit rappel en choisissant cette formule vous venez d’installer le thème Divi mais ausi le plugin Divi, Visual Page Builder.
7) Créer et éditer une page avec Divi
Voici comment est structurée une page du Page Builder Visuel de Divi.
– Tout d’abord nous avons un long encadré bleu (A) qui traverse toute la page, cet élément est appelé section.
– Dans chaque section en cliquant sur le petit disque vert avec le plus vous allez pouvoir insérer un autre élément appelé rangée (B), c’est cet encadré vert (c’est comme un tableau de positionnement)
-Dans chaque rangée en cliquant sur le petit disque gris foncé vous allez pouvoir placer un module (C), modules qui vont peu à peu constituer votre page.
De nombreux modules (C) au design avancé sont prêts à être insérés en cliquant simplement dessus : le module accordéon, appel à l’action, barre latérale, bascule, blog, bouton etc.).
La section, la rangée et le module sont imbriqués c’est un peu le jeu des poupées russes. Pour ajouter une nouvelle section, il suffit de se placer sous la section supérieure et de cliquer sur le petit disque bleu avec un plus.
Ces 3 éléments que sont Les sections, les rangées modules ont à peu près le même menu. (D)
A savoir qu’il est possible de les déplacer en glisser/déposer en utilisant la croix, voyez je peux déplacer cette ranger dans la section du dessous.
En cliquant sur l’engrenage vous accédez aux réglages de l’élément ici de la rangée.
Les 2 petits rectangles superposés permettent de dupliquer l’élément.
Comme vous l’aurez deviné, la poubelle sert à effacer l’élément.
La fonction petite icone avec des colonnes est propre au menu de la rangée et va servir à définir le nombre de colonnes souhaité et leur positionnement afin de pouvoir y insérer plusieurs modules.
A chaque fois que vous cliquez sur l’icône engrenage d’une section, d’une rangée ou d’un module, une fenêtre avec 3 onglets s’ouvre :
a) Onglet Contenu, c’est là que vous entrerez le contenu « brut » de l’élément.
b) Onglet Style, c’est ici que vous apporterez une amélioration visuelle au contenu. (taille, espacement, couleur etc.)
c) Onglet Avancé, vous trouverez dans cet onglet des options supplémentaires.
A noter que quand la fenêtre paramètres d’un module est ouverte et que vous passez la souris sur les différentes parties de votre module, de petits pinceaux apparaissent.
En cliquant sur le pinceau de l’élément, vous serez conduit directement au Style (dans la fenêtre paramètres) applicable à cette partie du module. Ces pinceaux sont très pratiques, vous permettent de vite vous y retrouver et vous font gagner du temps.