Créer un site web en équipe

1. Créer un site web en équipe Collège Pagnol, Rueil Mars 2009

2. Sommaire • Tâches d’administration • Accéder au serveur web en ftp avec FileZilla • Administrer le spip (Publication, création de rubriques, sauvegardes, plugins, mises à jour) • Personnalisation du site • Favicon • Plan d’accès Google maps • Mots clés • Modification du code source

3. Accéder au serveur Web en Ftp • Logiciel : FileZilla (gratuit à télécharger) • 1/ menu fichier, gestionnaire de site • 2/ Rentrer les paramètres du compte : (le chef d’établissement possède les identifiants de ce compte, nom d’utilisateur et mot de passe) 1 2 3 4 5

4. Accéder au serveur Web en Ftp - 3/ Connectez vous au site Arborescence du site sur le serveur Web Arborescence de votre machine local Il suffit de glisser déplacer des fichiers ou des dossiers de l’un à l’autre pour télécharger les fichiers du site Web ou bien déposer des fichiers de la machine locale vers le serveur Web.

5. Administration du Spip • Publication des articles, des brèves et des forums • Les demandes de publication s’affichent automatiquement dans la page d’accueil de l’administrateur • Il lui suffit de de cliquer dessus et de choisir la publication, la poubelle, le refus, ou de le remettre en cours de rédaction (pour les articles)

6. Administration du Spip • Création des rubriques Cliquer dans la page d’accueil sur : « créer une rubrique » Donner un nom, un emplacement et éventuellement un commentaire

7. Administration du Spip • Sauvegardes : • Avant toutes opération délicate dans le site (mise à jour ou modification du squelette, il faut sauvegarder la base de données, c’est-à-dire tous les objets du site : articles, rubriques, auteurs, etc …, ainsi que le dossier images de spip (/IMG)

8. Administration du Spip • Sauvegardes : • 1/ • 2/ • 3/ • 4/ • 5/

9. Administration du Spip • Sauvegardes : • La base est sauvegardée. Il suffit de retourner à la gestion du site • Télécharger ensuite sur sa machine personnelle à l’aide de filezilla : • le fichier dump situé dans le dossier tmp/dump du spip • le dossier images de spip : /IMG

10. Administration du Spip • Mise à jour (plugin ou dans le dossier squelette) • Remplacer avec Filezilla les anciens fichiers html, css ou php par les nouveaux mis à disposition sur le site des créateurs du squelettes ATTENTION : les mises à jour écrasent les anciens fichiers. Tout squelette modifié devient par conséquent très difficile à mettre à jour au bout d’un certain temps !

11. Administration du Spip • Mise à jour de Spip • De nouvelles versions de Spip apparaissent régulièrement et il est nécessaire de le mettre à jour afin de renforcer la sécurité, mais également de profiter de nouvelles fonctionnalités. Il faut vérifier que son squelette est bien compatible avec la nouvelle version de Spip • Avant de mettre à jour il faut toujours : faire un dump, sauvegarder le dossier /IMG et parfois décocher les plugins • Il suffit ensuite de déposer sur le serveur l’ensemble de l’arborescence du nouveau Spip.

12. Administration du Spip • Remarque sur la sécurité : Il est recommandé de ne pas laisser complètement ouvert les forums de Spip car ceux-ci peuvent être victimes de robots spammeur. Il est préférable d’ouvrir au cas par cas les articles sur les forums et de bien en faire la modération régulièrement. Lorsque le forum n’est plus commenté, il faut penser à le fermer. En aucun cas, il ne faut laisser les forums ouverts, si Spip n’a pas été mis à jour avec la dernière version !

13. Administration du Spip 1 • Plugins : • Aussi bien les squelettes que d’autres fonctionnalités peuvent être ajoutées à un Spip • Principes : déposer dans le répertoire plugins du Spip les dossiers des plugins trouvés sur le Web, puis cocher dans l’interface privée les plugins souhaités 2 3

14. Administration du Spip • Plugins : • Avec spip 2.0, les plugins peuvent être installés automatiquement, ce qui évite d’avoir à accéder au ftp. Adresse du site de plugin ou du flux Cocher et valider le plugin désiré

15. Personnalisation du site avec le favicon • Les pages Html qui doivent afficher le favicon doivent contenir la ligne : <link rel="shortcut icon" href="#CHEMIN{images/favicon.ico}"> • Le favicon se place dans le dossier images du squelette • Il s’agit d’un fichier qui doit être au format :

16. Personnalisation du site avec le favicon • Le site : http://www.html-kit.com/favicon/, permet de générer automatiquement un favicon à partir d’une image de n’importe quel format. Il possède également des outils de validation des favicons ainsi que de traitement de l’image.

17. Personnalisation du site avec un plan d’accès Google Maps • Allez sur www.google.fr puis cliquer sur connexion en haut à droite • Créez un compte iGoogle avec identifiant et mot de passe puis cliquez sur Maps

18. Personnalisation du site avec un plan d’accès Google Maps • Cliquez sur (1) « Mes cartes » puis (2) « créer une nouvelle carte » • Créez votre carte puis cliquez sur (3) « obtenir l’URL de cette page ». Faites un copier coller du code html (1) (2) (3) (4) (4) dans l’article « plan d’accès » de votre site

19. Personnalisation du squelette avec les mots clés • Les mots clés permettent au rédacteur (si l’administrateur lui en laisse le droit) depuis l’interface privée de spip de personnaliser et d’optimiser l’apparence du site publique. Ils permettent bien souvent de positionner des objets (articles, rubriques, liens…) où on le désire sur la page d’accueil. • Les mots clés peuvent s’associés à des articles, des rubriques, des sites web référencés.

20. Personnalisation du squelette avec les mots clés Choisir le mot clé pour l’article

21. Personnalisation du squelette par modification du code source • Attention, ces changements sont lourds de conséquence. • La mise à jour du squelette devient très délicate voire impossible • Toujours faire une sauvegarde du fichier que l’on modifie dans son état initial • Utilitaires : File Zila, jext (éditeur html), éditeur de texte (bloc notes pour la css), Firefox avec les plugins colorzila et webdevelopper

22. Personnalisation du squelette par modification du code source • Précautions : • Toujours garder sur le serveur une version initiale des fichiers que l’on modifie en changeant leur extension (exemple : .html devient .back) • Faire différentes versions des fichiers modifiés et les garder sur son ordinateur personnel (exemple : footer1.html, footer2.html, footer3.html, etc …) et remplacer la dernière version sur le serveur • Revenir à l’ancienne version si problème

23. Personnalisation du squelette Web etab • Mode d’emploi : http://www.tice.ac-versailles.fr/Squelette-etablissement.html