Le Pic
Projet Internet et Citoyenneté

Accueil > LES OUTILS > SPIP, la doc du CMS > Des mises en pages personnalisées >

Fiche N°1 - Créer l’environnement de travail PDF

par manu

Mettre en place un environnement de travail, afin de pouvoir simplement modifier les squelettes de son site


Utilisez un site de tests

Tout ce que vous allez faire dans ces « fiches-cuisines » va avoir un impact sur tout le site, pas seulement sur un article déterminé. Et contrairement à ce qui se passe lorsque vous écrivez un article, tout ce que vous faites aura un effet immédiat... pour le meilleur comme pour le pire !

Donc, ne travaillez pas sur un site en production !

Installation d’un site local sous SPIP...

Le mieux est donc de travailler à la mise en pages de votre site en installant SPIP sur votre machine, chez vous [1]. Pour modifier les fichiers de squelette, vous aurez besoin d’un éditeur de texte. Si vous travaillez sous Windows, notepad++ [2] fera parfaitement l’affaire. Si vous êtes sous gnu/Linux, n’importe quel éditeur de texte est utilisable : vi, emacs, gedit, etc.

ATTENTION, n’utilisez jamais un outil de traitement de texte pour éditer les fichiers de squelettes, cela ne marchera pas bien.

...ou travail directement sur un serveur

Mais vous pouvez également travailler sur un site de test installé sur un serveur (celui du PIC par exemple). Il vous faudra cependant éditer les fichiers, la manière la plus simple est de procéder de la manière suivante :

  • Installez le logiciel client ftp FileZilla [3]
  • vous pouvez alors utiliser votre éditeur de texte préféré (voir ci-dessus) pour éditer directement les fichiers qui se trouvent installés sur le serveur.

Utilisation du plugin SkelEditor

Que le site soit en local ou sur un serveur distant, vous avez encore la possibilité d’installer le plugin SkelEditor [4] : grâce à ce plugin, vous pouvez modifier vos fichiers de squelette depuis l’espace privé de SPIP, donc sans autre outil sur votre poste de travail qu’un navigateur.

Création du répertoire squelettes

Les fichiers du squelette par défaut de SPIP se trouvent dans le répertoire appelé squelettes-dist. Nous allons créer et modifier des fichiers dans le répertoire squelettes : en effet, si deux fichiers ayant le même nom se trouvent dans le répertoire squelettes et dans squelettes-dist, c’est toujours celui du répertoire squelettes qui sera utilisé. Ainsi, lorsque vous mettrez à jour SPIP, peut-être le fichier se trouvant dans squelettes-dist sera-t-il modifié, mais pas celui se trouvant dans squelettes, et qui contient toutes vos personnalisations.

Exemple : si vous recopiez le fichier sommaire.html dans votre répertoire squelettes ce sera celui-ci qui sera interprété et non plus celui de squelettes-dist

ATTENTION Si vous utilisez SkelEditor, vous devez créer (avec votre client ftp) le répertoire squelettes comme indiqué ci-dessus, et lui donner les bonnes permissions afin que le serveur web puisse écrire dedans. Sur le serveur du PIC, les droits 770 (read/write/execute pour l’utilisateur et le groupe, aucun droit pour le reste du monde) seront suffisants.

Création du sous-répertoire css

De la même manière, vous pouvez modifier les fichiers .css habillant les squelettes, et qui se trouvent dans le sous-répertoire css de squelettes-dist.

Cependant, il est plus simple d’ajouter les propriétés nécessaires dans un fichier supplémentaire, que vous appellerez obligatoirement perso.css, et qui sera bien sûr dans le répertoire squelettes/css [5]

Vous allez donc dès maintenant créer le répertoire squelettes/css, et mettre dedans le fichier perso.css (vide pour l’instant).

Protection du répertoire squelettes-dist

Dans ces fiches nous serons amenés souvent à copier des fichiers de squelettes-dist vers squelettes, puis à éditer les fichiers de squelettes. Il est très simple de se tromper dans ce genre de manips : il est donc important de protéger le répertoire squelettes-dist, afin d’avoir toujours une squelette "qui marche" auquel on peut se raccrocher. Pour cela vous pouvez :

  • Le copier ou le zipper quelque part sur votre disque
  • Le mettre en lecture seule : sous FileZilla, cliquez (bouton droit) sur squelettes-dist puis option du menu Attributs du fichier : mettez en Lire,Exécuter mais pas écrire squelettes-dist ainsi que tous ses fichiers et sous-répertoires.

Donc maintenant, si vous avez tout suivi, vous devez avoir les répertoires et fichiers suivants :

squelettes
squelettes/css
squelettes/css/perso.css

Sécurisation du squelette

Lorsque vous aurez terminé votre squelette, retirez tous les droits en écriture sur les fichiers que vous avez créés : cette mesure simple vous garantira contre la défiguration de votre site due à d’éventuels pirates.

[1Comme expliqué ici ou

[5Si vous travaillez à partir d’un thème zpip ou d’un autre squelette, il est possible que perso.css soit en fait dans le répertoire squelettes