Créer son site WordPress en 201912 minutes à lire

Créer son site WordPress ne s’invente pas du jour au lendemain, certes il est plus facile de construire un site en partant d’un CMS comme WordPress plutôt que de coder en dur en partant de zéro, néanmoins l’utilisation de WordPress nécessite des connaissances.

Dans ce tutoriel écrit, je vais vous apprendre à établir votre site sur un serveur local (votre ordinateur) puis démarrer la construction d’un site sur WordPress.

Vous êtes prêts, c’est parti !

Télécharger le logiciel XAMPP

Comme vous le savez peut-être, il existe 2 types de WordPress. WordPress.com, qui permet de créer un site déjà hébergé chez WordPress gratuitement et qui vous permet de consulter votre site via l’url suivante : nomdevotresite.wordpress.com. WordPress.org, permet de télécharger les fichiers de WordPress pour les ajouter n’importe où (en local sur votre ordinateur ou sur un serveur distant) et vous permet d’être beaucoup libre dans la création. En effet, WordPress.com bloque certaines fonctionnalités (eh oui, il faut passer aux offres plus élevées, et donc payer (eh oui, l’argent c’est le nerf de la guerre, comme partout !).

Aujourd’hui, on va utiliser la solution WordPress.org. En effet, sur WordPress.com, tout le monde peut créer son site facilement sans avoir besoin de compétences particulières.

Tout d’abord, il vous faut donc télécharger le logiciel XAMPP, ce logiciel va vous permettre de créer un mini-serveur sur votre ordinateur. Via ce logiciel, vous pourrez créer votre base de données qui permettra de stocker les données du site et pouvoir afficher votre site depuis un navigateur via une l’url suivante : localhost/nomdevotresite. Attention, le site est stocké sur votre pc, vous êtes donc le seul à le voir quand vous tapez l’url dans votre navigateur. Un ami ne pourra pas, sur son pc, consulter votre site en tapant l’url ci-haut sur son ordinateur. Soyez également averti sur le fait que votre site est stocké sur votre pc, donc si votre pc plante, votre site est perdu (je peux vous le dire j’en ai fait l’amère expérience et c’est pas forcément très agréable).

Téléchargez donc le logiciel Xampp à cette adresse : https://www.apachefriends.org/fr/index.html. Choisissez ensuite l’OS sur lequel vous souhaitez l’installer. Dans mon cas, je suis sous Windows. Certains utilisent aussi WAMP ou MAMP, l’utilisation est quasi-similaire.

Vous rencontrez un souci avec Xampp ?

Cliquez sur l'icône ci-dessus, remplissez le formulaire pour vous aider.

Une fois le processus d’installation terminée, ouvrez le logiciel XAMPP puis activez  Apache et MySQL en cliquant sur Start pour ces 2 lignes. Les 2 services seront surlignés en vert s’ils sont opérationnels.

Nous allons débuter par la création de la base de données, pour cela, sur la ligne MySQL, cliquez sur Admin. A partir de là, une fenêtre va s’ouvrir. C’est l’administration PHPMYADMIN, cette interface vous permet de gérer vos bases de données.

Nous allons ainsi créer la base de données.

 

Dans le bandeau latéral gauche de phpMyAdmin, cliquez sur Nouvelle base de données.

Puis suivez les indications à droite ->

Ca y est, vous avez créer la base de données, maintenant, vous pouvez fermer cet onglet de votre navigateur.

Suite au téléchargement de XAMPP, dans votre explorateur de fichiers, un nouveau dossier a été crée. Cherchez l’emplacement Windows (C:). A l’intérieur, vous avez un dossier nommé xampp. Ouvrez le dossier puis ouvrez le dossier htdocs. Ici sont listés tous les sites que vous allez créer en local.

Pour créer un nouveau site, créez un nouveau dossier. Ouvrez ce nouveau dossier.

Maintenant, il vous faut télécharger la dernière version de WordPress. Pour cela, dans votre navigateur, allez sur le site https://fr.wordpress.org/ et cliquez sur le bouton ‘Obtenir WordPress’ puis cliquez sur ‘Télécharger WordPress …’. Le chiffre après WordPress correspond à la version de WordPress. WordPress est mis à jour régulièrement.

Dans vos téléchargements, vous allez obtenir un fichier .zip qu’il faudra ouvrir puis dézipper. Une fois les fichiers dézippés, basculez ces derniers dans le dossier que vous avez créer plus tôt dans htdocs. Attention, pensez à bien basculer les fichiers wp-admin, etc… dans votre dossier et non avoir uniquement le dossier wordpress qu’il faudra encore ouvrir pour accéder aux fichiers.

Fichiers WordPress en local

Ouvrir un nouvel onglet dans votre navigateur puis indiquer ceci dans la barre de recherche : localhost/nomdevotredossier. Pensez bien à remplacer nomdevotredossier par le nom que vous avez donnée (ex : dans mon cas, je l’ai nommé : nv-site-web donc j’aurais : localhost/nv-site-web.

Vous avez cliqué sur entrer et maintenant vous voilà sur la page d’installation de WordPress.

Installer WordPress

Sur la page d’installation de WordPress, lisez bien le message puis cliquez le bouton ‘C’est parti !’.

Remplissez ensuite les informations comme sur l’image ->

En pensant à bien remplacer le nom de la base de données par celle que vous avez crée.

Vous n'arrivez pas à installer WordPress ?

Cliquez sur l'icône ci-dessus, remplissez le formulaire pour vous aider.

WordPress vous affiche ensuite un petit message vous indiquant que vous avez passé la 1ère étape de l’installation. Cliquez ensuite sur le bouton ‘Lancer l’installation’.

Pour terminer l’installation, vous devrez renseigner les informations suivantes :

  • Titre de votre site
  • Votre identifiant (celui qui vous permettra de vous connecter quand vous taperez dans le navigateur : nomdevotresite/wp-admin)
  • Votre mot de passe pour vous connecter
  • Votre email (c’est avec cet email que WordPress vous alertera des modifications importantes sur votre site)

Vous pourrez également cocher ou non si vous souhaitez que votre site soit indexer par Google. Dans notre cas, notre site est en local, il est préférable de cocher la case.

Cliquez ensuite sur ‘Installer WordPress’.

L’installation est maintenant terminée. WordPress vous demandera de vous connecter avec les identifiants que vous venez de renseigner.

 

Utiliser WordPress

Vous avez réussi à installer WordPress, bravo ! Maintenant, la partie la plus intéressante commence. Vous pouvez à présent commencer à concevoir votre site. Mais avant toute chose, laissez moi vous présenter l’interface de WordPress.

Tableau de bord de WordPress

Voilà l’interface de WordPress ! Au démarrage, le site est plutôt vide. Sur votre gauche, vous avez une liste de menus :

  • Accueil : votre tableau de bord
  • Mises à jour : c’est ici qu’il faudra mettre à jour les extensions, thèmes et votre version de WordPress
  • Articles : regroupe tous les articles rédigés sur votre site
  • Médias : liste l’ensemble des images, vidéos, présent(e)s sur votre site
  • Pages : regroupe toutes les pages de votre site
  • Commentaires : c’est ici que vous pourrez gérer les commentaires qui arrivent sur votre site
  • Apparence : c’est ici que vous pourrez ajouter/modifier/supprimer les thèmes sur votre site. Attention à ne pas ajouter trop de thèmes, vous pouvez utiliser qu’un seul thème à la fois.
  • Extensions : regroupe tous les modules installés sur votre site. Pour résumer : une extension = une fonctionnalité. Idem, ne pas installer trop d’extensions et supprimer les extensions non utilisées.
  • Utilisateurs : si vous êtes plusieurs à gérer le site, c’est ici que vous pourrez ajouter, gérer les utilisateurs. Attention à leur affecter les bons droits.
  • Outils : une liste d’outils plus ou moins utiles. Je ne vais pas rentrer dans les détails.
  • Réglages : vous pourrez entre autres ici effectuer les réglages standards de votre site. Je vous laisse découvrir par vous-même.

Ce que je vous propose à présent, c’est d’ajouter un thème gratuit qui contient différentes démos. Avec les démos, vous allez gagner du temps puisque vous allez pouvoir importer un site tout prêt (avec du faux-texte) et il vous suffira de modifier les textes et les images (en gros^^).

Installer un thème

Nous allons utiliser le thème Astra, thème très connu par les utilisateurs WordPress pour sa simplicité d’utilisation et sa capacité à réaliser très rapidement des sites très professionnels.

Dans le bandeau latéral gauche de WordPress, cliquez sur Apparence->Thèmes. Cliquez ensuite sur le bouton ‘Ajouter’. Dans la barre de recherche, tapez ‘Astra’. Cliquez ensuite sur ‘Installer’. Cliquez ensuite sur ‘Activer’.

 

Créer son site WordPress en 2019 1

Cliquez ensuite sur le bouton ‘Commençons’, le thème va installer l’extension ‘Astra Starter Sites’ qui permettra d’importer les démos. Patientez pendant l’activation.

A l’étape suivante, on vous demande de choisir le constructeur de pages, vous avez le choix entre 4 constructeurs. Le constructeur va vous permettre de mettre en pages vos articles par exemple, vous allez pouvoir ajouter des blocs en drag-drop (glisser-déposer). Je vous recommande d’installer ‘Elementor’ mais vous pourrez installer les autres si besoins. Nous allons ici travailler avec Elementor. Cliquez ensuite sur ‘Next’.

Vous voici ensuite sur la page listant les démos que vous pouvez importer. Dans ce thème, il y a de très nombreuses démos, des gratuites, des payantes, dans plusieurs domaines d’activité. Ici, nous allons utiliser une démo gratuite. Dans ce cas, cliquez sur l’onglet ‘Free’, vous allez filtrer uniquement les démos gratuites.

Dans mon cas, je vais importer la démo d’un restaurant car j’ai envie de créer un site pour un restaurant mais vous pouvez choisir une autre démo. Cliquez sur ‘Preview’ puis cliquez sur le bouton ‘Import Site’. Le temps d’installation prend de 2 à 10 minutes selon votre connexion et le poids de la démo. Profitez-en pour faire chauffer un café et manger un petit biscuit 🙂

Vous souhaitez confier la gestion de votre site WordPress à un professionnel ?

L’installation de la démo est désormais terminée. En cliquant sur ‘View site’, vous allez pouvoir voir le résultat sur votre site. Dans mon cas, j’ai importé la démo du restaurant et j’ai maintenant une base sur laquelle je vais pouvoir travailler.

Pour modifier votre site à présent, veuillez retourner sur votre tableau de bord WordPress. Ensuite, cliquez sur Apparence->Personnaliser. Ici, vous pourrez modifier les paramètres de votre site, parmi les volets proposés vous pourrez notamment choisir quelle page sera la page d’accueil de votre site ou encore modifier la couleur des liens, je vous laisse découvrir par vous-même.

Retournez dans le tableau de bord en cliquant sur la croix en haut à gauche de l’écran. Une fois sur la page, cliquez sur ‘Pages’. Vous obtenez la liste des pages de votre site. Passez la souris sur la page que vous souhaitez modifier et cliquez sur Modifier avec Elementor. Dans mon cas, j’ai choisi la page d’accueil.

 

Modifier vos pages avec Elementor

Interface de modification d'une page avec Elementor

Elementor s’appuie sur une interface de glisser-déposer pour gérer ses blocs. Chaque élément que vous voyez sur une page s’appuie sur un bloc.

Le fonctionnement d’une page est très simple. Une page s’appuie sur plusieurs structures qui contiennent chacune plusieurs blocs (que vous pouvez voir à gauche de l’image ci-dessus). Pour modifier un bloc, il vous suffit de cliquer dessus et vous pourrez modifier chaque élément de ce bloc (taille, police, arrière plan, etc…).

Pour ceux qui ont des bases en CSS, vous pourrez modifier depuis le bloc le padding, margin, etc…

Le fonctionnement est le même sur toutes les pages.

Une fois votre page terminée, pensez à cliquer sur ‘Mettre à jour’.

Si parmi vos pages secondaires, vous voulez créer une structure duplicable sur d’autres pages pour ne pas avoir à recréer manuellement, vous pouvez enregistrer votre page comme modèle. Pour cela, cliquer sur le petit bouton à côté de ‘Mettre à jour’, puis ‘Enregistrer comme modèle’. Donnez un nom à votre modèle pour vous permettre de le retrouver facilement puis enregistrer. Créez ensuite une nouvelle page que vous allez modifier avec Elementor. Une fois sur la nouvelle page vierge, cliquez sur le bouton gris entre le bouton ‘+’ de couleur violette et le bouton vert. Vous obtenez la liste des modèles enregistrés, cliquez sur le modèle que vous avez enregistré puis cliquez sur ‘Intégrer’. Ça y est, vous avez importé votre structure.

Vous voulez aller plus loin avec Elementor ?

Revenez sur le tableau de bord de WordPress. Une fois toutes vos pages prêtes et terminées, vous pourrez afficher celles que vous souhaitez dans votre menu de navigation.

Dans le bandeau latéral gauche de WordPress, cliquez sur Apparence->Menus. Vous pourrez ici ajouter les pages que vous souhaitez afficher dans le menu de navigation.

A cette étape, vous avez installer WordPress, ajouter un thème puis importer une démo issue du thème que vous avez modifié grâce à Elementor (qui est une extension).

A présent, vous pouvez soit modifier vos pages pour régler les derniers ajustements graphiques soit publier votre site pour qu’il soit disponible en ligne. Pour cela, vous devrez choisir un hébergement avec un nom de domaine pour rendre votre site visible aux internautes. Plusieurs offres existent et répondent à différents besoins.

Dans un de mes précédents articles, j’explique comment migrer un site WordPress local en ligne.

J’espère que ce tutoriel vous a plu ? Si oui, n’hésitez pas à le partager à votre entourage qui débute sur WordPress. Pour les autres, je serais ravi d’entendre vos commentaires, j’ai conscience que l’article pourrait être encore plus complet donc je suis ouvert à écouter vos suggestions de contenus pour compléter l’article, je souhaite que cet article soit le plus complet possible pour aider les débutants sur WordPress à créer de véritables sites professionnels.

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *