Comme vous le savez Xampp est une plateforme qui englobe tous les composants d’un serveur web (Apache, mySQL, …) dont vous aurez besoin pour développer vos applications en local.

Voulez-vous ajouter un nom de domaine local du genre monprojet.local au lieu de localhost ?

Les fichiers de votre serveurs doivent être placés sur le dossier xampp/htdocs, ce qui rend l’affichage des fichiers développés sur un autre dossier fatigant !

Si vous voulez ajouter des dossiers extérieurs du dossier xampp/htdocs à votre serveur Xampp ce tutoriel vous sera utile =)

Dans ce tutoriel vous allez découvrir comment ajouter vos propres dossiers à Xampp et créer votre propre domaine local à la place du « localhost » !

Allons-y !

Ajouter des « virtual-hosts »  à Xampp.

1. Configuration des virtual-hosts sur Xampp

Pour appliquer ce tutoriel comme il le faut, nous allons premièrement préparer les lignes de configuration que nous allons utiliser afin d’ajouter notre virtual-host à notre Xampp !

Premièrement nous aurons besoin d’activer le port 80 pour les virtual-hosts.

Modifier « httpd-vhosts.conf » pour ajouter vos propres VH

Si vous avez le dossier xampp sur le disque C: alors cherchez ce chemin : C:xamppapacheconfextra

1 xampp apache conf extra vhosts

Puis ouvrez le fichier httpd-vhosts.conf à l’aide de « Notepad++ » pour faciliter la tâche…

2 httpd-vhosts namevirtualhost 80 xampp

Enlevez le # de la ligne NameVirtualHost *:80

Et ajoutez à la fin du fichier une nouvelle hôte virtuelle (Virtual Host) comme suit :

<VirtualHost easytutoriel.local:80>
DocumentRoot "C:/Users/soufiane/Documents/easytutoriel"
ServerName easytutoriel.local
ErrorLog "logs/easytutoriel.local-error.log"
CustomLog "logs/easytutoriel.local-access.log" combined
<Directory "C:/Users/soufiane/Documents/easytutoriel">
Require all granted
Allow from all
</Directory>
</VirtualHost>

Remplacez le chemin C:/Users/soufiane/Documents/easytutoriel par le chemin de votre dossier, et le nom de domaine désiré à la place de  easytutoriel.local ;)

2. Ajoutez le NDD local à « hosts »

1ère étape : Ouvrez votre éditeur en tant qu’administrateur

Nous allons maintenant ajouter le domaine .local à « hosts » pour le lier à notre adresse IP locale.

Pour ce faire ouvrez votre éditeur en tant qu’administrateur, ou ouvrez le Gestionnaire des tâches, « Fichier » > « Exécuter une nouvelle tâche » > notepad++ (avec « Créer cette tâche avec des privilèges d’administration« ) puis cliquez « OK« .

3 gestionnaire des taches notepad++

Une fois votre éditeur est ouvert en tant qu’administrateur, nous allons ouvrir le fichier hosts.

2ème étape : Modifier le fichier « hosts »

Le fichier hosts se trouve dans le dossier %SystemRoot%System32driversetc

Un astuce, recopiez le chemin du dossier sur la zone « Nom du fichier » et tapez Entrer, vous aurez hosts en face sans avoir à suivre le chemin…

Sélectionnez « hosts » puis cliquez « Ouvrir » pour commencer l’édition du fichier.

4 hosts windows ouvrir notepad++

Ajoutez une ligne de ce format :

127.0.0.1       easytutoriel.local

Ne supprimez aucune ligne, ici # est un commentaire, ajoutez votre ligne à la fin du fichier sans #.

5 hosts ajouter ligne local domaine

Enregistrez le fichier, si vous n’avez pas ouvert l’éditeur en tant qu’administrateur vous ne pourrez pas l’enregistrer.

3. Redémarrez Apache !

Une fois tout cela est fait, redémarrez Apache sur Xampp en cliquant sur « Stop » puis sur « Start« .

6 redemarrer apache xampp

Résultat :

Voici un test, j’ai mis un fichier salut.php sur mon dossier et en utilisant l’adresse http://easytutoriel.local/salut.php j’ai pu afficher le contenu de mon fichier ;)

7 test easytutoriel.local ca marche xampp

Bonus : Changer le Root complètement

Si vous voulez changer le « root » de Xampp, vous n’avez qu’à ouvrir le fichier httpd.conf sur xamppapacheconf et redémarrer Apache ;)

9 xampp htdocs documentroot

Et voilà voilou !

Si ce tutoriel vous a été utile, je serai très content si vous mettez un « merci » en commentaire =)

Sinon je vous donne un rendez-vous au prochain tutoriel !

Merci de votre lecture, cher lecteur.

Soufiane – Easytutoriel.com