Personnalisation de la page d’accueil [vidéo inside]

Bonjour à tous et à toutes, vous allez ici découvrir comment personnaliser en profondeur votre piratebox grâce à une feuille CSS, mais rassurez vous les connaissances nécessaires sont basiques. La vidéo de présentation est en bas de page.

Je tiens à préciser que ce tuto est originalement écrit par Thomas Fourmeux et utilisé en license Creative Commons.

Préalable: Avoir un logiciel de copie SCP, sous windows je vous conseil WinSCP et sous OSX Fugu.

Ainsi qu’avoir téléchargé les fichiers suivants et les avoir décompressés.

Etape 1: Connectez vous à votre piratebox en wifi ou via un câble RJ45 (ethernet)

Etape 2: Lancez votre logiciel de connexion SCP (WinSCP/Fugu)
Votre fenêtre ressemblera à ceci:

fenêtre winscp

Fenêtre WinSCP

Ou bien à ceci si vous êtes sous OSX:

Fenetre Fugu

Fenêtre Fugu

Etape 3: Avec WinSCP, il vous suffit de:
-Remplir le champ ‘Nom d’hôte’ par l’adresse IP de votre piratebox, si vous n’y avez pas touché celle-ci est: 192.168.1.1
-Laissez le numéro du port à 22
-Mettre dans ‘Nom d’utilisateur’ root
-Et remplir votre mot de passe
-Puis de cliquer sur ‘Connecter

Avec Fugu, la manipulation est un peu rallongée, vous devez:
-Cliquer sur ‘SCP‘ dans la barre des options en haut à gauche

SCP Fugu

SCP Fugu

-Puis ‘Nouvelle Copie Sécurisée‘. Vous devriez maintenant voir cette fenêtre apparaître:

Fenêtre SCP

Fenêtre SCP

Dans le champ, ‘Hôte distant’ toujours l’adresse IP de votre piratebox (192.168.1.1)
Dans ‘Nom d’utilisateur’ root
Dans ‘Port’, comme avec WinSCP, 22

Avec Fugu vous devez aussi indiquez les éléments à copier, vous devez donc sélectionner les fichier présents dans le dossier que vous téléchargé et décompressé au début de ce tuto (www). Ainsi dans le champ ‘Copier le fichier à l’emplacement:’ rentrez /opt/piratebox/www
Vous pouvez dès à présent cliquer sur ‘Copie sécurisée’ et le tutoriel s’arrête une fois que tous les fichiers du dossier www ont été copiés pour vous qui utilisez OSX
Pour les autres on continue courage 🙂

Une fois la connexion établie avec WinSCP naviguez dans la fenêtre de droite à travers les dossiers comme suit opt>piratebox>www

Navigation dans WinSCP

Navigation dans WinSCP

Copiez à cette destination le contenu du dossier www décompressé, s’il vous demande de remplacer le fichier index.html, dîtes oui.

Enfin fermez votre session WinSCP.

Et voilà! Bravo vous venez de changer radicalement l’apparence de votre piratebox 🙂

Pour un aperçu de ce que cela donne: 

Publicité

4 réflexions au sujet de « Personnalisation de la page d’accueil [vidéo inside] »

  1. Bonjour,

    Pouvez-vous me dire quels sont les limites de la pirateBox par rapport à la personnalisation de son interface ?

    Le site web qui s’affiche lorsqu’on s’y connecte est-il totalement personnalisable ? Jusqu’à quelle taille peut-il faire? Est-il hébergé sur la clé USB ou le routeur?

    Et surtout y a-t-il un moyen de mettre à jour ce site web à distance?

    Bien à vous et merci pour votre travail très intéressant sur ce magnifique jouet de partage 🙂

    • Bonjour,
      Vous pouvez tout à fait tout refaire à la main, il n’y a pas de limite que celle de votre niveau en HTML, CSS et autre 🙂
      Il est hébergé sur la clé, je pense donc qu’avant de remplir quelques gigas avec une simple page web vous avez de la marge 😉
      Là est l’étape plus compliqué, puisque la box n’est pas reliée à un réseau non, mais si vous décidez de la raccorder à un réseau, alors là oui c’est possible
      J’espère avoir répondu à vos questions 🙂
      Cordialement

  2. bonjour je voudrais savoir la marche a suivre pour pouvoir supprimer les fichier présent dans browse files directement depuis l’interface web pour le moment je peux suprimer que la partie forum. Ma piratebox est faite avec un raspberry pi je suis débutant et je nage complètement dedans merci

Votre commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:

Logo WordPress.com

Vous commentez à l’aide de votre compte WordPress.com. Déconnexion /  Changer )

Image Twitter

Vous commentez à l’aide de votre compte Twitter. Déconnexion /  Changer )

Photo Facebook

Vous commentez à l’aide de votre compte Facebook. Déconnexion /  Changer )

Connexion à %s