Home
classy black, blog, Slyze, actualité, high-tech, twitter, facebook, google, clubic, nouweo, video, musique
Posté le 20 janvier 2010, par Slyze. Catégorie Tutoriels

Bonjour à tous !

Vous voulez devenir un blogueur influent et vous faire inviter dans tous les salons high-tech autour du monde ? Il y a du boulot et de la patience derrière tout ça. Ce tuto va vous expliquer de A à Z l’installation d’un blog ou d’un site grâce au CMS (Content Management System ou Système de Gestion de Contenu en français) Wordpress pour bien débuter dans ce domaine.

Mais pourquoi Wordpress ?

  • c’est un CMS mis à jour régulièrement
  • c’est une communauté française active
  • il peut aussi bien gérer des blogs que des petits sites
  • un blog entièrement personnalisable
  • des milliers de thèmes trouvables sur Internet
  • vous pouvez également créer votre thème (avec beaucoup de patience et en étudiant sérieusement le CSS)

Convaincu par Wordpress ? Eh bien, suivez les étapes et vous atteindrez la gloire ! (ou tout du moins, vous pourrez taper votre premier billet :P )

Dans ce tuto, je vais en quelque sorte retracer mes aventures dans la création de blog avec une adresse du style http://www.mon-blog-super-bien.com/ et non pas un blog du genre monblog.wordpress.com ou monblog.blogspot.com. De toute façon, nous on est des fanas d’informatique donc on est des fous, haha !

Ne vous préoccupez pas de la longueur de ce tuto, c’est en fait très rapide à faire si vous faites bien tout ce que je dis. Je vous jure qu’en moins d’une demie-heure c’est fait :) (hormis le temps que l’hébergeur installe la base de données sur le serveur, cela dure plusieurs heures).

Choix de l’hébergeur web

On commence vraiment de zéro… On a vraiment rien. Enfin, ce que je vous demande pour continuer, ce sont des choses que normalement vous devez avoir. Il vous faut donc :

  • un ordinateur (ça vous l’avez…)
  • une connexion Internet (vous lisez ce tuto donc vous l’avez aussi…)
  • une carte bancaire (là ça peut coincer…)
  • une idée de la future adresse de votre blog

QUOI ? Faut payer ???!!!

Disons que ce n’est pas obligatoire mais personnellement, j’en suis venu à ce point. En effet, j’ai bien essayé de trouver des hébergeurs gratuits mais soit il y a de la pub, soit l’espace disque est limité, soit l’hébergeur a fermé ses inscriptions (croyez-moi c’est presque tout le temps le cas). Heureusement, un hébergement web n’est pas très cher. Pour mon blog par exemple, je paye 1,99€/mois (hors taxes, ce qui fait moins de 30€/an TTC) et c’est largement suffisant pour débuter.

Il existe une multitude d’hébergeurs web proposant des packs hébergement : 1&1, MavenHosting, Infomaniak, PlanetHoster ou encore OVH. Etant donné que le serveur que je loue est chez OVH, je vais choisir cet hébergeur. Le pack hébergement Perso propose 25 Go d’espace disque, ce qui est bien suffisant et un trafic mensuel de 500 Go, ce qui je pense est largement suffisant également ! Par contre, je vous préviens tout de suite : si vous voulez faire un blog qui contient beaucoup d’images lourdes, l’espace dédié à la base de données sera un peu limite.

Et pourquoi OVH ?

D’une part, c’est l’hébergeur que j’ai personnellement choisi pour mon blog, je viens de le dire. Mais je sais que ce n’est pas suffisant alors je dirais que 1&1 et OVH ont à peu près les mêmes offres, mais j’ai eu des difficultés de paiement chez 1&1 donc j’ai été sur OVH. Mavenhosting et Infomaniak sont chers et PlanetHoster offre un moins bon rapport capacité/prix. De plus, j’ai entendu dire que le service technique d’OVH est beaucoup plus compétent et à l’écoute que 1&1. Après, c’est vous qui décidez, et de toute façon, je suis conscient que dans quelques années, peut-être que la situation sera différente.

Dans ce tuto, nous allons donc choisir le pack perso d’OVH ! Let’s go !

La fiche technique vous présente très en détail l’offre d’OVH. Vous pouvez la lire si vous voulez mais il y a des chances que vous ne comprenez pas tout ce qui est écrit (au moins, je vous aurai prévenu !). Cliquez donc sur Commander avec le joli caddie qui va avec. Je ne vous détaille pas par images car il y a pas mal d’étapes, mais je ne vais pas vous laisser tout seul dans l’inconnu non plus, je ne suis pas un monstre !

  • Vous arrivez sur un écran qui vous demande le nom de domaine à réserver à gauche. Tapez-le donc dans le champ (par exemple « mangafan » sans les guillemets bien sûr). A droite, vous verrez toutes les extensions qui prendront la couleur verte, orange ou grise. Une extension verte est disponible, une extension orange est renouvelable et une extension grise est indisponible. Parmi eux, le .fr est disponible, réservons-le et cliquez sur « Continuer » en bas de l’écran.
  • L’écran suivant vous confirme que le nom de domaine « mangafan.fr » est disponible. Ne touchez à rien et cliquez sur « Continuer ».
  • Vous arrivez sur un choix d’offre : prenez l’offre Gold (les deux autres ont un surcoût et sont inutiles pour nous)
  • Vous arrivez sur la prévisualisation de votre commande qui vous indique que tout cela va vous coûter 28,56€ TTC pour une durée d’un an. Vous pouvez revenir sur votre décision en cliquant sur « Revenir » mais je pense qu’on va quand même « Continuer » hein !
  • A moins que vous ne soyez déjà client d’OVH, il faudra cliquer sur « Nouveau Contact » et remplir un formulaire avec votre nom, prénom, pays de résidence, téléphone portable (OVH vous enverra un SMS avec un code que vous devrez taper dans un champ caché et on vous demande comment vous avez connu OVH puis cliquez sur « Continuer » deux fois (l’écran suivant ne sert à rien pour nous). Je vous déconseille donc de remplir ces champs avec des noms ou des numéros bidons.
  • Si vous êtes résident français, on vous demande quelques autres renseignements. Cliquez sur « Continuer ».
  • Sur l’écran suivant, plusieurs contrats sont présents. Vous pouvez tous les lire puis cocher la case « J’ai pris connaissance des contrats et je les accepte » et cliquer sur « Continuer ».
  • Vous tombez sur un écran avec un numéro de commande, la facture et les modes de paiement. Dès que vous aurez effectué le paiement, vous recevez plusieurs mails dont la commande, la facture, vos identifiants de connexion et l’installation de votre nom de domaine de la forme « [OVH-perso]mangafan.fr installé » (c’est un mail important qui contient vos identifiants FTP).

Avant de continuer vers la prochaine étape, il faut absolument créer une base de données. Sans ça, pas de blog… C’est pas très compliqué, vous allez voir. Rendez-vous sur https://www.ovh.com/managerv3/. On vous demande votre identifiant et votre mot de passe, que vous trouverez dans un mail du genre « Votre identifiant client blablabla » envoyé par OVH. Dès que vous aurez rempli les deux champs correctement, cliquez sur « Connexion ».

Je vais pas vous mentir : le Manager OVH est un calvaire à utiliser. Enfin, vous m’avez comme guide, heureusement pour vous :) . Il y a un champ déroulant en haut de l’écran, sélectionnez votre-site.fr. A gauche (ou en bas, au choix), cliquez sur « Hébergement » puis sur « Gestion SQL » et enfin sur « Nouvelle base ». Donnez un nom à votre base et cliquez sur « Valider ». Si vous surveillez votre boîte mail, vous devriez recevoir un mail avec vos codes d’accès aux bases de données MySQL d’OVH. Cliquez ensuite sur « Phpmyadmin ».

Dans le menu déroulant, choisissez votre base de données (ça tombe bien, on en a qu’une :P ) et en-dessous, on vous donne deux paramètres : le serveur et le login. Retenez surtout le serveur (de la forme mysql5-2.perso), puis cliquez sur « vous connecter à Phpmyadmin ». Tapez le login, le mot de passe (dans le mail que vous venez de recevoir) et cherchez dans les deux menus déroulants le paramètre du serveur (dans notre exemple « mysql5-2″ dans la première liste déroulante et « perso » dans la deuxième) puis cliquez sur « Exécuter ». Pour les étourdis, si vous avez un doute, le type de serveur est également écrit dans le mail donc pas de soucis :) .

Attention, nous en venons à un point assez tordu : la création de la base de données en elle-même. Accrochez-vous, c’est difficile à suivre. Donc quand vous vous serez connectés à Phpmyadmin, vous arriverez à un écran du même genre que celui-ci :

Pour créer une base de données, vous devez taper un nom (« mangafan » par exemple) et cliquer sur Créer. Voilà, c’est tout. C’était dur, hein ? :P Vous n’avez besoin que de créer la base de données car Wordpress installera automatiquement les tables nécessaires à son bon fonctionnement lors de son installation.

C’est tout ce que vous avez à faire pour l’hébergeur. Maintenant, il faut passer à l’installation de Wordpress !

Téléchargement et installation de Wordpress

On a besoin de plusieurs choses :

  • Un hébergeur (on vient de le faire :D )
  • Un client FTP : Filezilla (ou autre logiciel équivalent)
  • Un utilitaire de compression/décompression de fichiers tels que Winzip ou IZArc (que j’utilise personnellement)
  • Toujours votre navigateur et votre connexion Internet :P

Nous allons commencer par configurer Filezilla pour qu’il se connecte rapidement à votre serveur. Petite explication rapide du logiciel d’abord. La fenêtre est divisée en quatre grandes parties.

  • En 1, c’est là que le logiciel indique la bonne ou mauvaise réception de fichiers, le succès ou l’échec de l’authentification au serveur, bref… plein d’informations. Les messages d’erreurs seront écrits en rouge.
  • En 2, c’est votre disque dur (serveur local).
  • En 3, c’est le serveur (serveur distant)
  • En 4, ce sont les fichiers en cours d’envoi vers le serveur.

Maintenant, allons configurer le logiciel pour qu’il se connecte au serveur. Suivez le guide et cliquez sur la toute première icône en haut à gauche (attention, pas sur la flèche). Vous arrivez sur cette fenêtre à l’apparence bien compliquée :S

Pourtant, c’est simple quand on sait où trouver. Eh oui, rappelez-vous que OVH vous a envoyé un mail avec vos codes FTP (de la forme « [OVH perso] truc.fr installé »). Retrouvez ce mail. Tout d’abord, cliquez sur « Nouveau site » et renommez-le (par exemple « mangafan.fr »). Dans le champ « Hôte », indiquez l’adresse du serveur FTP indiqué dans le mail, le type de serveur est naturellement « FTP – File Transfer Protocol », le type d’authentification est « Normale » et enfin, indiquez l’identifiant et le mot de passe que vous trouverez encore dans le mail. Cliquez sur « OK » et c’est tout ! Filezilla est maintenant configuré pour se connecter rapidement à votre serveur ! Vous n’avez plus qu’à cliquer sur la flèche tout en haut à gauche et sélectionner « mangafan.fr » pour que Filezilla se connecte à votre serveur. C’est beau hein ? :)

Maintenant, allons télécharger Wordpress sur le site officiel. Voici le lien : télécharger Wordpress.

Créez un dossier où vous voulez (sur le bureau par exemple) que vous nommerez « Blog » et décompressez le dossier zippé que vous venez de télécharger. Surtout, vérifiez que tout soit bien décompressé et qu’il ne manque rien. Ouvrez également Filezilla et connectez-vous à votre serveur.

Côté local (rectangle 2), parcourez votre PC jusqu’à être à l’intérieur du dossier « Wordpress » (qui est lui-même dans le dossier « Blog » du Bureau) : vous devez avoir pas mal de fichiers et trois dossiers : « wp-admin », « wp-includes » et « wp-content ». Côté distant (rectangle 3), parcourez le serveur jusqu’au dossier « www » (il doit être presque vide). Après, c’est tout simple : faites un glisser-déposer du 2 au 3 et au bout de quelques dizaines de secondes (le temps du transfert de fichier de votre PC au serveur), vos fichiers seront sur Internet ! Pendant le transfert, vous pourrez vérifier dans le rectangle 4 qu’aucun transfert de fichier n’a échoué (ça ne doit pas arriver). Mais attention, Wordpress n’est pas encore installé ! :(

Ouvrez votre navigateur et tapez dans la barre d’adresse :

http://www.votre-nom-de-domaine.fr/wp-admin/install.php (dans notre cas http://www.mangafan.fr/wp-admin/install.php)

Vous arrivez sur une sorte de page d’erreur, mais c’en est pas vraiment une. En effet, Wordpress constate que vous n’avez pas de fichier wp-config.php. Vous pouvez vérifier avec votre client FTP en cherchant côté serveur, vous ne voyez aucune trace de wp-config.php. Par contre, vous pouvez voir un fichier s’appelant wp-config-sample.php. De là, deux solutions :

  • La plus simple est de passer par l’interface web comme le dit le navigateur mais on vous préviens que cela ne marche pas sur tous les serveurs
  • Un peu plus compliqué (mais vraiment un peu) : il faut modifier le fichier wp-config-sample.php et l’enregistrer sous le nom wp-config.php

La première solution marche avec les serveurs OVH, donc on va l’utiliser. Pourquoi faire compliqué quand on peut faire simple mh ? Cliquez sur « Créer le fichier de configuration ». Wordpress vous prévient qu’il aura besoin de certaines informations, qui sont toutes contenues dans le mail (sauf le nom de la base de données que vous avez crée dans Phpmyadmin : ben oui, OVH ne peut pas savoir à l’avance quel nom vous allez donner à votre base de données) où est présent les pass pour se connecter à Phpmyadmin :

  • Le nom de la base de données (dans notre exemple « mangafan1″)
  • L’identifiant de la base de données
  • Le mot de passe de la base de données
  • L’hôte de la base de données : pour être franc avec vous, c’est là où j’ai le plus buté car l’hôte de la base de données est tout simplement le serveur (vous savez, le truc du style mysql5.2-perso). Ca paraît logique dit comme ça mais j’ai essayé avec l’adresse de mon site et plein d’autres solutions avant de trouver la bonne !
  • Le préfixe de table (on y touchera pas)

Cliquez ensuite sur « Allons-y ! ». Remplissez donc les cinq champs demandés (voir précédemment). Vous remarquerez qu’au champ « Hôte de la base de données », Wordpress vous indique qu’il y a 99% de chances que ce dernier est « localhost ». Eh bien pas de bol, chez OVH, ce n’est pas le cas :P . Validez tout ça.

A l’écran suivant, cliquez sur « Lancer l’installateur ». Un nouvel écran arrive et vous demande le nom de votre blog (qui apparaîtra dans le header du blog) et une adresse e-mail (qui vous avertira de la présence de nouveaux commentaires sur votre blog). Ne touchez à rien d’autre et cliquez sur « Installer Wordpress ». L’écran suivant vous donne un identifiant (qui est « admin ») et un mot de passe très compliqué à retenir et que je vous conseille de copier-coller sur le Bloc-Notes de Windows par exemple, en attendant de le changer. Cet identifiant et ce mot de passe vous permettront de vous connecter à votre panneau d’administration. Cliquez sur « Se connecter ».

L’écran suivant vous demandera l’identifiant et le mot de passe que Wordpress vient de générer. Tapez-les en copiant-collant à l’aide du document texte que vous avez eu l’intelligence de laisser ouvert et cliquez sur « se connecter ». Vous arrivez enfin à votre panneau d’administration !

Vous pouvez d’ores et déjà commencer à taper vos billets mais avant cela, je vous conseille de changer de mot de passe en allant dans « Utilisateurs » puis en modifiant le profil « admin ». D’autres choses que je vous conseille de faire :

  • Changer le thème de votre blog, car celui par défaut est sacrément moche !
  • Fouiller dans les plugins pour trouver des outils qui vous faciliteront la rédaction de billets, qui rendront votre blog plus pratique à utiliser ou qui vous donneront des informations de trafic sur votre blog.
  • Changer les réglages du blog

Et comment je fais pour aller dans le panneau d’administration quand je voudrai aller taper mes billets demain par exemple ?

Tapez tout simplement dans la barre d’adresse de votre navigateur « http://www.mon-site.fr/wp-admin » ! Il vous faudra ensuite vous identifier comme vous venez de le faire.

Voilà, vous avez toutes les cartes en main et toutes les explications nécessaires pour pouvoir commencer à bloguer comme un vrai pro ! :D

Si vous avez des questions, ou des suggestions d’amélioration à me faire parvenir, commentez !

classy black, blog, Slyze, actualité, high-tech, twitter, facebook, google, clubic, nouweo, video, musique

Un commentaire sur cet article

  1. Gixel dit :

    Et dire que sans ce tuto je n’aurais pas commencé mon nouveau blog, t’as pensé à mettre des screens pour illustrer le tuto, sympa.

Faire un commentaire

classy black, blog, Slyze, actualité, high-tech, twitter, facebook, google, clubic, nouweo, video, musique
Designed by