SPIP est un système de publication web permettant la gestion collaborative de sites, avec une interface intuitive pour la rédaction et la mise en page d'articles. Il sépare les responsabilités entre webmasters, éditeurs et rédacteurs, tout en offrant des fonctionnalités comme la création de rubriques, articles, brèves, forums et mots-clés pour une navigation facilitée. SPIP utilise une base de données MySQL et des squelettes pour automatiser la présentation du contenu, garantissant ainsi une mise à jour efficace et une navigation fluide.

1. SPIP (www.spip.net) Saïd Radhouani Université de Genève mars 2005

2. SPIP - Développement collaboratif de sites Système de Publication sur Internet Ensemble de fichiers, installés sur votre compte Web Permettent de : Gérer un site à plusieurs, Mettre en page des articles sans avoir à taper du code HTML, Modifier très facilement la structure d'un site avec un simple navigateur Avec un simple navigateur, SPIP permet de “ fabriquer” et de tenir un site à jour, grâce à une interface très simple d’utilisation

3. SPIP - Développement collaboratif de sites SPIP permet de : Gérer un site Web de type magazine => composé d’ articles et de brèves insérés dans une arborescence de rubriques imbriquées les unes dans les autres Séparer trois types de tâches : la composition graphique la contribution rédactionnelle via proposition d’articles et de brèves la gestion éditoriale du site (tâche qui comprend l’organisation des rubriques, la validation des articles proposés...)

4. SPIP - Séparation des t âches Webmaster  aspect graphique des pages HTML appelées " squelettes " modification de pages "squelettes" modification de feuilles de style CSS Éditeurs : organisation du site création/modification de la hiérarchie des rubriques validation des articles Rédacteurs : rédaction des pages à l’intérieur du site utilisent la hiérarchie de rubriques mais ne peuvent pas la modifier

5. Principaux éléments de SPIP - Rubriques Une rubrique : espace destiné à accueillir des articles, des brèves (équivalent d'un dossier dans le système de fichiers ) Structure de type hiérarchique : rubrique --> sous-rubriques, etc. Structure des rubriques => l’ossature du site elle détermine : l’interface; le mode de navigation; les relations entre articles et entre brèves... Rubriques secteurs (ex. 1 & 2)

6. Principaux éléments de SPIP - Rubriques pas de structures circulaires -> simplicité d’utilisation Seules les rubriques actives (qui contiennent au moins un article publié) sont affichées sur le site public On peut attacher un forum à chaque rubrique Seuls les administrateurs peuvent créer, modifier ou supprimer des rubriques

7. Principaux éléments de SPIP - Articles Composé de plusieurs éléments définits au moment de l’administration du site : un titre, sous-titre, descriptif, text principal, etc... Équivalent d'une page web Différents statuts possibles : en cours de rédaction proposé à la publication publié : l’article est publié sur le site public refusé : l’article n’est pas publié Un article ne peut se trouver que dans une seule rubrique à la fois O n peut attacher un forum à chaque article

8. Principaux éléments de SPIP - Brèves Les brèves : des «articles» de moindre importance que les véritables articles Méthode simple et rapide de publication Constituées d’un nombre très réduit d’informations : un titre, un texte et un lien hypertexte => idéal pour le suivi de l’actualité, une revue de presse en ligne, etc. Gestion plus sommaire que les articles : non signées mise en place très simple : interface réduite, validation d’un clic On peut attacher un forum à chaque brève

9. Position des brèves dans la structure du site Eviter que les brèves ne fassent double-emploi avec les articles => intégrer uniquement dans les rubriques secteurs Exemple: brèves dans les rubriques 1 et 2 pas dans leurs sous-rubriques (contrairement aux articles). => la présentation de la page des brèves se fait directement en fonction de ces grandes rubriques

10. Principaux éléments de SPIP – Forums Par défaut, modérés à postériori : chaque message envoyé par un utilisateur du site est immédiatement publié A dministrateurs : interface qui permet de lire les derniers messages postés et, éventuellement , de les supprimer Administrateur : modifier le comportement des forums en choisissant : l’absence totale de forums sur son site des forums modérés à priori des forums sur abonnement Les messages supprimés ne sont pas détruits de la base : mis de côté + adresse IP de l’expéditeur + date et heure de l’envoi + forum à usage interne entre les différents auteurs autorisés à écrire

11. Principaux éléments de SPIP – mots clés Limitation de SPIP : structure hiérarchique --> un article ne peut appartenir qu’à une seule rubrique mots-clés offrent => moyen de navigation transversal à l’intérieur du site Associer des mots-clés à un article => navigation entre différents articles portant sur les mêmes thèmes (en créant des liens) Les mots-clés n’ont réellement d’intérêt que si chaque mot est associé à plusieurs articles, afin de pouvoir les relier Seuls les administrateurs peuvent : créer et modifier les mots-clés désactiver l’utilisation des mots-clés (interface « configuration précise) Si structure des rubriques bien conçue => pas de mots-clés (articles de thèmes similaires se trouvent dans les mêmes rubriques)

12. Les sites référencés Un système complet permettant de gérer des listes de liens vers d’autres sites Il permet de : regrouper ces listes dans des rubriques (avec des articles), ou dans des rubriques spécifiques dédiées à cet usage ~~ annuaire de liens) attribuer un logo à chaque site attribuer des mots-clés pour chaque site référencé ajouter un descriptif personnalisé pour chaque site Référencer un nouveau site Bouton « référencer un nouveau site » dans la page de chaque rubrique Méthode «traditionnelle» => indiquer le nom du site, URL, une description Référencement rapide : indiquer l’URL de la page à référencer et de valider SPIP va récupérer automatiquement le titre de la page et un descriptif

13. Principaux éléments de SPIP – Sites Syndiqués Fabriquer automatiquement un fichier standardisé indiquant les dernières publications du site (backend) Aller récupérer de tels fichiers sur le réseau, et de les inclure dans sa propre navigation => Indiquer sur son propre site des listes des dernières publications d’autres sites Lorsque ces sites sont mis à jour, les nouveautés apparaissent automatiquement sur votre propre site Les sites syndiqués sont indiqués dans les rubriques (de façon à afficher, à côté de ses propres articles, des articles tirés d’autres sites ayant une thématique similaire) Demo : http://www.davduf.net/backend.php3

14. Fonctionnement du site public Contenu d’un site : stocké dans une base de données MySQL Présenter le contenu aux visiteurs => il faut : récupérer les données de la base, les organiser les mettre en page, afin de délivrer une page HTML M ise en page : effectuée au moyen de squelettes qui contiennent des instructions permettant d’indiquer où et comment se placent les données dans la page S ystème de cache => stocker chaque page + éviter de provoquer des appels à la base de données à chaque visite

15. Fonctionnement du site public Système de publication automatisé => ne pas redéfinir une interface différente en HTML pour chaque page isolée ex. tous les articles bénéficieront de la même interface, le système placera chaque fois des données différentes Pour chaque type de document =>deux fichiers : .php3 et .html Répertoire principal de SPIP => les couples : article.php3 / article.html, rubrique.php3 / rubrique.html, etc . Ces fichiers peuvent être modifiés et d'autres couples peuvent être créés

16. Modification de l'apparence du site public Deux possibilités : Modifier les feuilles de styles tout en gardant la même structure de pages ET/OU Modifier les squelettes pour créer une nouvelle structure de site

17. Feuilles de style Les feuilles de styles par défaut sont : spip_style.css styles de base http://www.spip.net/fr_article1177.html typographie.css polices de caractères, alignement du texte habillage.css mise en page des éléments : marges, bordures, éléments impression.css utilisée pour l'impression ex. lien hypertexte -> désactiver la couleur + afficher l’URL à la suite du lien

18. Squelettes Leur rôle ~ « modèles » pour la gestion de la mise en page Des fichiers à l’extension .html Chaque fichier est associé à un type de page différent : un squelette pour le sommaire, un pour l’affichage des articles, un pour l’affichage des rubriques, etc. Un squelette contient : du HTML standard définissant l’habillage de la page, Des balises spécifiques à SPIP pour définir quelles informations vont venir « habiter » cet habillage

19. Squelettes Avant d’utiliser un squelette, il faut pouvoir l’appeler : crée r à la racine d u site un fichier , par exemple &quot; tutoriel.php3 &quot; contenant les lignes suivantes : <? $fond = &quot;tutoriel&quot;; $delais = 0; include &quot;inc-public.php3&quot;; ?> => fixer deux variables ($fond et $delais) + appeler le fichier qui déclenche le fonctionnement de SPIP (inc-public.php3) $fond : nom du fichier qui contient la description de la mise en page ( le squelette ) Le fichier de description sera contenu dans tutoriel.html (dans $fond, on n’indique pas la terminaison .html) $delais : l’âge maximum pour l’utilisation du fichier stocké en CACHE (fixé en secondes)

20. Squelettes La base de données : toutes les informations sur l es articles, les rubriques, l es auteurs, etc. &quot; fabriquer &quot; le site => extraire certains éléments de cette base à l'aide de boucles , de balises , de critères de sélection et de filtres Un squelette de page contient : du code HTML des références (appelées balises) aux colonnes des tables de la base de données

21. Exemple Archive.html => HTML : varie en fonction du &quot;contenu&quot; que vous souhaitez afficher <html> <title>Mes archives</title> <head></head> <body> <!-- ici s'affiche mes archives --> <BOUCLE_archi(ARTICLES){tout}{par titre}> [(#DATE|affdate)<br />] <a href=#URL_ARTICLE&quot;>[(#TITRE)<br />]</a> </BOUCLE_archi> </body> </html> => Afficher &quot;tout&quot; les articles &quot;publiés&quot;, triés par date, avec un lien qui mène directement sur la page de l'article dans l'ensemble de votre contenu Archive.php3 => php: varie en fonction du $fond de son double en .html <?php $fond = &quot;archive&quot; ; $delais = 24 * 3600; include (&quot;inc-public.php3&quot;); ?> => Afficher le &quot;$fond&quot; de son double (archive.html)

22. Boucles La notion de base du langage de SPIP est la boucle syntaxe : <BOUCLEn(TYPE){critère1}{critère2}...{critèrex}> Code HTML + balises SPIP </BOUCLEn> TYPE : type d’éléments qu' on veut récupérer correspondre obligatoirement à l’un des types prévus dans SPIP (ARTICLES, RUBRIQUES, AUTEURS, BREVES, etc. )

23. Boucles Exemple de fichier squelette « tutoriel.html » : <BOUCLE_article(ARTICLES){id_article= 2 }> #TITRE </BOUCLE_article> Pour l'appeler, utiliser l'url http://nom_site/tutoriel.php3 SPIP va chercher le titre de l’article 2 de la base, et l’ inscrir à la place de #TITRE

24. Boucles En ajoutant d u HTML et d’autres balises SPIP, on obtient une page plus riche <BOUCLE_article(ARTICLES){id_article= 2 }> <H1>#TITRE</H1> < P >#CHAPO</ P > <P>écrit par: #LESAUTEURS</P> <P align=justify>#TEXTE </BOUCLE_article>

25. Boucles Dans l'exemple précédent, le paramètre (numéro d'article) était &quot;codé en dur&quot;. Pour faire un squelette qui fonctionne pour n'importe quel article : On remplace {id_article= 2 } par {id_article} => Appel avec une URL qui précise la valeur du paramètre : http://nom_site/tutoriel.php3?id_article= 2

26. Boucles Boucle faisant la liste de tous les articles : <BOUCLE_article(ARTICLES)> #TITRE<BR> </BOUCLE_article> Boucle faisant la liste des 10 premiers articles : <BOUCLE_article(ARTICLES){1,10}> #TITRE<BR> </BOUCLE_article>

27. Boucle avec critères multiples A ffich er les 10 articles les plus récents appartenant à une rubrique : <BOUCLE_article(ARTICLES){id_rubrique}{par date}{inverse}{1,10}> <a href=#URL_ARTICLE>#TITRE</A><BR> </BOUCLE_article> Appel avec l'URL http:// nom_site /tutoriel.php3?id_rubrique=1 {id_rubrique} : ne prend que les articles appartenant à la rubrique id_rubrique {par date}{inverse} : tri par date dans l’ordre décroissant . . . {1,10} : . . . et prend les 10 premiers résultats <a href=#URL_ARTICLE>#TITRE</A> va écrire non seulement le titre de l’article mais en plus créer un lien vers cet article

28. Boucles – éléments conditionnels <B n > Code HTML optionnel avant <BOUCLE n (TYPE){critère1}{critère2}...{critèrex} > Code HTML + balises SPIP </BOUCLE n > Code HTML optionnel après </B n > Code HTML alternatif <//B n > Le code optionnel avant n’est affiché que si la boucle contient au moins une réponse Le code optionnel après n’est affiché que si la boucle contient au moins une réponse Le code alternatif est affiché à la place de la boucle (et donc également à la place des codes optionnels avant et après) si la boucle n’a trouvé aucune réponse

29. Boucles imbriquées A fficher, sur la même page, les éléments de la rubrique elle-même et une liste des articles <BOUCLE_rubrique(RUBRIQUES){id_rubrique}> <H1>#TITRE</H1> <BOUCLE_article(ARTICLES){id_rubrique} {par date}{inverse}{0,10}> <a href=#URL_ARTICLE>#TITRE</A><BR> </BOUCLE_article> #TEXTE|justifier </BOUCLE_rubrique> Appel avec http://nom_site/tutoriel.php3?id_rubrique=1

30. Boucles – balises et critères de sélection Pour une liste complète des boucles et des balises existantes, consulter la rubrique http://www.spip.net/fr_rubrique143.html

31. Filtres L es boucles permettent de structurer la page de manière logique, reste à présenter les données de manière esthétique Les filtres transforment le contenu de la base de données en code HTML plus présentable Une donnée stockée dans la base se présente comme un bloc, et on peut avoir envie de manipuler la variable correspondante avant de l’afficher à l’écran exemples : justifier, aligner_droite, saison (qui affiche « été » si la variable est une date comprise entre le 21 juin et le 20 septembre) . . . Pour utiliser un filtre il faut utiliser la syntaxe : [ (#VARIABLE|filtre) ]

32. Filtres l es filtres peuvent être enchaînés [ (#DATE_REDAC|saison|majuscules) ] affichera &quot; HIVER &quot; L'utilisation des crochets permet de ne pas afficher un bloc si une balise renvoie une chaîne vide cf. éléments conditionnels des boucles

33. Exemples Voir le tableau des méthodes à utiliser pendant l'écriture d'un article pour ajouter des titres, du texte en gras, en italique, etc... EPS Académie de Lyon : http://www2.ac-lyon.fr/enseigne/eps/index.php Éditeur de squelettes : http://www.glums.com/serveur/spip/squelette/ Démo - C-L http://129.194.71.104/spip/ecrire/?bonjour=oui