SPIP (www.spip.net)

Saïd RadhouaniUniversité de Genèvemars 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

On 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é

Administrateurs : 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

Mise 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

Systè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.cssstyles de basehttp://www.spip.net/fr_article1177.html

typographie.csspolices de caractères, alignement du texte

habillage.cssmise en page des éléments : marges, bordures, éléments

impression.cssutilisé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éer à la racine du site un fichier, par exemple "tutoriel.php3"

contenant les lignes suivantes :<?$fond = "tutoriel";$delais = 0;include "inc-public.php3";?>

=> 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 les articles, les rubriques, les auteurs, etc.

"fabriquer" 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 "contenu" 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">[(#TITRE)<br />]</a></BOUCLE_archi>

</body></html>

=> Afficher "tout" les articles "publiés", 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 = "archive";$delais = 24 * 3600;include ("inc-public.php3");?>

=> Afficher le "$fond" 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 du 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 "codé en dur". 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

Afficher 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

<Bn> Code HTML optionnel avant<BOUCLEn(TYPE){critère1}{critère2}...{critèrex}> Code HTML + balises SPIP </BOUCLEn> Code HTML optionnel après</Bn> Code HTML alternatif<//Bn>

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

Afficher, 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

Les 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

les filtres peuvent être enchaînés[(#DATE_REDAC|saison|majuscules)] affichera "HIVER"

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