Tutoriel / Documentation

Formation SPIP 3

Organiser son site et bien rédiger ses contenus

Documentation un peu technique pour gérer son site sous SPIP 3 (pour les formations ASD/IAN/DANE du mois d’avril 2018).
On suppose ici que le lecteur connaît déjà un peu SPIP et son interface privée.

Les numéros des objets

Dans SPIP chaque objet (rubrique, article, document, etc. - on va les décrire plus bas) a un numéro (ou identifiant).
Ces numéros sont utiles pour faire des liens ou associations entre les objets, apprenez à les retrouver facilement.

Les squelettes

Les squelettes du sites sont des modèles de pages mis en place par le webmestre. Ces modèles construisent l’affichage des différents types de page (page d’article, de rubrique, d’auteur, etc. sans oublier bien sûr la page d’accueil).

Le webmestre averti peut construire lui-même les squelettes ou utiliser des plugins qui fournissent ces squelettes.

On ne parlera pas des squelettes dans cette page mais il faut savoir que les squelettes et ses feuilles de style ont des conséquences sur l’affichage de vos contenus.

Les auteurs

Pensez dans votre compte à compléter les champs :

  • Adresse électronique. Elle ne sera jamais affichée en clair dans la partie publique. Indispensable pour réinitialiser son mot de passe. Dans un site institutionnel (établissement, disciplinaire, etc), c’est l’adresse courriel professionnelle qui doit être utilisée
  • Biographie : indiquer votre rôle et centres d’intérêt et éventuellement votre établissement
  • Paramétrer vos préférences (liens des menus en particulier)
Droits des utilisateurs
ActionsInternauteVisiteurRédacteurAdministrateur restreintAdministrateurWebmestre
Consulte le site public Oui Oui Oui Oui Oui Oui
Consulte des contenus publics réservés Non Oui Oui Oui Oui Oui
Accède à la partie privée
et rédige des articles
Non Non Oui Oui Oui Oui
Édite les rubriques, les auteurs Non Non Non Non Oui Oui
Change le statut des articles
et des différents objets
Non Non Non Oui
de ses rubriques
Oui Oui
Mais pas son rôle
Assure la gestion éditoriale du site Non Non Non Non Oui Oui
Mais pas son rôle
Assure la maintenance technique Non Non Non Non Non Oui

Les rubriques

Les rubriques définissent la structure du site. Ce sont des « conteneurs » des autres objets. Les articles, brèves et sous-rubriques, documents éventuellement y sont rangés.

Il faut éviter de créer :

  • des rubriques avec trop peu de contenus ;
  • trop de niveaux de sous-rubriques : en général 2 niveaux de rubriques sont suffisants.

Pour ordonner les rubriques, il faut préfixer le titre de chacune d’entre elles à l’aide d’un numéro suivi d’un point et de la syntaxe suivante :

01. Première rubrique
02. Rubrique 2
10. Rubrique 3
15. etc.
20. etc. etc.

La structure du site et de ses contenus est visible dans le plan du site (cliquer sur Icône « Plan du site » en haut à gauche).
Cette page permet de déplacer rapidement des contenus.

Les logos

Dans SPIP chaque objet peut-être associé à un visuel : son logo.
Le logo est une image représentant ou illustrant par exemple votre article. Il faut privilégier les images au format jpg (pour les photos ou captures d’écran) ou png (pour des logos) de dimension 400 à 500px maximum et pas trop petite non plus.

Le squelette du site affichera à différents endroits les logos représentant les objets listés.

Les articles

Choisissez la rubrique dans laquelle vous voulez déposer votre article. Créer l’article.
Compléter le titre, descriptif.
Enregistrez votre article.
N’attendez pas d’avoir créé l’article en entier pour ça, tant qu’il n’est pas enregistré, l’article n’existe pas. Si vous quittez malencontreusement la page avant enregistrement, vous perdrez toute votre saisie.
Une fois enregistré, votre article est « En cours de rédaction ».
Vous pourrez le modifier autant de fois que nécessaire.

Conseil : compléter au maximum les différents champs proposés.

  • le titre doit être court, parlant ;
  • le sur-titre et le sous-titre : à utiliser ;
  • le descriptif est important et s’affiche dans les pages amont de présentation de l’article (résumé court) ;
  • le chapeau permet d’introduire l’article en quelques lignes ;
  • le texte : peut être plus ou moins long et structuré. Le texte peut contenir :
    • du texte : paragraphes, intertitres, listes à puce, tableaux (pour des données tabulaires), citations, liens.
    • des images et documents ;
    • des notes de bas de page ;
    • du code html de façon exceptionnelle (pour afficher des contenus externes par exemple) ;
  • le champs Post-scriptum peut être utilisé par exemple pour citer des sources.
Statut des articles
CouleurStatutUsage
Blanc En cours de rédaction Brouillon, travail en cours
Orange Proposer à l’évaluation Quand l’article est prêt, ce statut permet aux autres auteurs de le voir (et d’être informé si réglages)
Vert Publié L’article est en ligne, visible sur le site
Rouge Refusé L’article doit être revu/relu avant publication
Noir Poubelle L’article est supprimé (complètement supprimé au bout de quelque temps)

Dans la partie privée, dans certaines listes d’objets il est possible de changer très rapidement le statut de ces objets en passant la souris sur l’icône colorée associé à l’objet.

Les raccourcis typographiques

Dans les contenus de SPIP, on dispose de « raccourcis typographiques » permettant de créer des mises en forme, des liens, etc.
Ces raccourcis sont générés à l’aide de la barre d’outil ou en les écrivant directement.

Un retours chariot se fait naturellement à l’aide d’un saut de ligne.

Les changement de paragraphe s’obtiennent par deux saut de ligne (une ligne vierge). Plusieurs lignes vides à la suite sont réduits à un seul. Des paragraphes courts permettent d’aérer la lecture.

Structure

  • intertitre : {{{intertitre}}} : permettent de bien structurer vos contenus. Important si le texte est long - la lecture sera facilité.
  • Avec le plugin Enluminure typographiques, on peut aussi faire :
    • des intertitres de second niveau : {{{**intertitre de second niveau}}}
    • des intertitres de troisième niveau : {{{***intertitre de second niveau}}}
    • des textes encadrés : [(paragraphe dans un cadre)]

Les intertitres de second et de troisième niveau permettent de structurer encore plus les choses (à condition de bien « imbriquer » ces intertitres).

Mise en forme de caractères :

  • gras : {{texte en gras}} ; à utiliser pour un élément que l’on souhaite appuyer : texte en gras
  • italique : {italique} ; à utiliser pour une élément sur lequel on veut insister : italique
  • Avec le plugin « Enluminures typographiques », on peut aussi faire des caractères colorés (2 raccourcis proposés).

Liens :

  • lien externe : [texte du lien->http://www.spip.net/] : lien : texte du lien
  • lien avec bulle d’aide : [texte du lien|Le site officiel de SPIP->http://www.spip.net/] : texte du lien
  • lien interne : il est possible de faire des liens à l’intérieur du site SPIP à l’aide des numéros des éléments et de leur type :
    • texte du lien : un lien vers l’article 12
    • Contact : un lien vers l’article 12 dont l’hyperlien est le titre de l’article
    • texte du lien : un lien vers la rubrique 5
    • ENT : un lien vers la rubrique 5 dont l’hyperlien est le titre de la rubrique
    • même principe avec par exemple ->aut1 (auteur n°1) ou ->br3 (brève n°3) ou ->doc56 (document n°3), etc.
    • Il est important pour les liens internes de les construire ainsi afin qu’ils ne soient pas considérés comme des liens externes (leur habillage diffère et les liens externes s’ouvrent en général dans une nouvelle fenêtre ou onglet)
  • ancre et retour à l’ancre : [definition_ancre<-] et [retour à l'ancre->#definition_ancre] : retour à l’ancre
  • définition dans Wikipedia : [?GPL] : appelle l’encyclopédie libre Wkipedia pour obtenir la définition du mot [1] : GPL
  • note de bas de page : texte [[note de bas de page]] : crée une note de bas de page avec le texte entre les doubles crochets [2]

Listes à puces

Les listes sont à utiliser pour tout ce qui à le sens d’une énumération (sans numéro ou avec).

Donnera :

  • première ligne
  • deuxième ligne
    • une sous liste à puce
  • de retour dans le niveau initial

Listes numérotées

Donnera :

  1. première ligne
  2. deuxième ligne
    1. une sous liste numérotée
  3. de retour dans le niveau initial

Tableaux

Les cellules de tableaux sont générés à l’aide du symbole « | ».
Pour être complètement accessible, un tableau dans SPIP doit avoir un titre et une description.
Les tableaux sont utiles pour présenter des données tabulaires, il ne faut pas les utiliser pour tenter de faire de la disposition ou mise en page.

Exemple :

Donnera :

Produits bio et prix
Produit Prix €
Beurre Bio 5€
Lait Bio 3€
Choux Bio 4€

Notez les doubles || sur la première ligne du tableau !

Attention : les pièges classiques avec les tableaux sont :

  • ne pas avoir le même nombre de | sur une ligne
  • avoir un espace après le dernier | de la ligne (un moyen simple de vérifier : la touche fin du clavier amène à la fin de la ligne)

Il est également possible de créer des tableaux avec fusion de cellules.

Caractères spéciaux

  • ~ (espace insécable ou espace dur — correspond au &nbsp; du HTML) placé entre deux mots remplace l’espace en ayant l’avantage d’être insécable, c’est-à-dire, qu’il empêchera les deux mots d’être séparés par un retour à la ligne malvenu. S’utilise en particulier entre le prénom et le nom propre.
  • -- : — (tiret cadratin) à utiliser pour les incises dans un texte
  • Dans la barre typographique des boutons permettent aussi d’afficher facilement les caractères spéciaux : À, É, œ, Œ, etc. (utile surtout pour les utilisateur windows)

Ligne horizontale
---- : 4 signes moins seuls sur une ligne donneront un trait de séparation horizontal.
Cette ligne permet également (sur les sites utilisant SPIPr-dane [3]) de réinitialiser l’alignement des éléments flottants tel <docXX|left>, <imgWW|right>, <embWW|right>.

Autres raccourcis un peu spéciaux :

  • Poésie <poesie>Le texte de la poésie</poesie>
  • Citation <quote>Texte d’une citation</quote>
Le geai gélatineux gégnait dans le jasmin
Voici mes infins le plus beau vers de la langue française.

C’est en forgeant que l’on devient forgeron.

PDF -
Les raccourcis typographiques : antisèche
PDF à imprimer issu de SPIP-Contrib

Les documents

  • Le poids du document : il doit être le plus faible possible, compatible avec l’objectif visé. Une image de 4000 x 3000 pixels de large pour un poids de 3 à 4 Mo, n’a généralement pas de sens, son affichage étant réduit à la largeur de la colonne dans laquelle elle est affichée. Si SPIP redimensionne l’image, cela n’en réduit pas pour autant son poids. Une image ne doit généralement pas dépasser 200 à 300 Ko. Pour les documents cela peut varier mais assurez-vous de toujours faire en sorte que le poids soit le plus faible possible. Il existe de nombreuses application de redimensionnement d’image. [4]
  • Le format du document :
    • utilisez des formats ouverts et reconnus par tous (pdf, txt, open document, etc.),
    • évitez les formats propriétaires ou potentiellement dangereux (doc, exe,...).
    • Pour les images, choisir les formats web : jpg (photos) et png ou gif (logos,illustrations).
  • La taille du document : pour les images, la résolution doit être de 72 dpi en mode RVB (Rouge Vert Bleu) et nous vous suggérons de ne dépasser une largeur de 1200px par image.
  • Les noms de fichier : « Un nom de fichier n’est pas une œuvre littéraire ».
    Veillez à ce que votre nom de fichier ne contienne ni espace, ni caractères accentués, tout en lui gardant une forme humainement lisible.
  • La licence du document : le document n’est-il pas protégé par le droit d’auteur, avez-vous l’autorisation de le placer en ligne ?
  • Le titre et le descriptif du document : ces champs permettent de décrire vos documents (légende ou description). Compléter le titre est indispensable (au moins pour les images).

Pour gagner du temps, il est possible d’ajouter plusieurs documents en une seule
fois. Soit :

  • en les regroupant au préalable dans une archive zip et en indiquant à SPIP de décompresser l’archive : chaque élément de l’archive deviendra alors un document SPIP.
  • En sélectionnant vos documents un à un (ou en les glissant/déposant) et de n’appuyer sur le bouton « Téléverser » qu’à la fin.

Ajout de document et alignement des images

Voir :

Conseils :

  • Donnez un titre à toutes vos images et documents décrivant le [sens/signification] de chacune d’elles. Idem pour tous vos documents. C’est nécessaire pour l’accessibilité (et donc un meilleur référencement) et pour retrouver plus facilement vos documents ;
  • Ne pas déposer plusieurs fois un même fichier sur votre site. Un ficher déposé précédemment se trouve dans la médiathèque et peut être réutiliser dans d’autres contenus.
  • Ne pas déposer un document déjà en ligne : utiliser son adresse URL pour l’ajouter en tant que « document distant » dans votre site ;
  • Éviter d’utiliser les alignements |left ou |right pour les documents non image.
  • Créer une galerie d’images en bas de l’article est très simple : déposer vos images dans le « Portfolio » et ne pas placer vos images dans le texte. Ces images génèreront une galerie d’images [5].

Focus sur oEmbed

Le plugin oEmbed doit être activé sur votre site [6].

Dans vos articles (ou autre contenu), coller simplement l’URL de la page un champs (texte en général ou chapo) sur une ligne isolée. Il est même conseillé d’entourer cette URL de crochets : < et >.
Exemple :
<https://pod.ac-caen.fr/video/0242-tablettes-regrouper-des-applis/>
Valider. La vidéo s’affiche dans votre contenu.

Vous pouvez aussi coller l’URL dans le champs « internet » d’un document pour obtenir un « document distant » et afficher la vidéo avec la balise <embXYZ|center> ou XYZ est le numéro du document.

Les mots-clés

Sur certains sites, il possible d’ajouter des mots-clés pour compléter vos contenus. Les mots-clés sont dans des groupes de mots-clés qui ont des réglages parfois spécifiques.
Ce sont des étiquettes (ou tags) que vous allez associer à votre contenu.

Il faut éviter que des mots-clés correspondent à des rubriques du site.

Ces mots-clés permettent sur le site public :

  • de créer du rebond sur les pages des contenus
  • de créer une navigation transversale (via des nuages de mots-clés éventuellement)

Certains mots-clés sont plus techniques et associés au squelette du site pour un affichage spécifique.

Sources

  • Des documentations de Dominique Lepaisant et Yannick Chistel
  • Des documentations de SPIP

Notes

[1Si le mot n’existe pas, vous pouvez le créer vous-même !

[2Et la note de bas de page est automatiquement numérotée, rendue cliquable, pour la consulter, et pour revenir au texte l’ayant appelée

[3SPIPr-dane est un plugin d’habillage des sites disciplinaires basé sur SPIPr et développé par la Dane

[4Plusieurs outils permettent de gagner du temps :

  • Photofiltre ou différents outils de traitement d’images permettent de réduire/redimensionner au préalable les images par lot
  • Si vous utilisez Firefox, vous pouvez installer le module « shrunked image resizer » pour un redimensionnement lors du téléversement.

Les images de plus de 1600px ne seront pas acceptées (sur la plateforme SPIP de l’académie de Caen)

[5Il est également possible d’utiliser le plugin « album » mais c’est un peu plus lourd

[6Préalable, à faire une seule fois :
Pour que votre site soit compatible oEmbed, activer le plugin SPIP « oEmbed », plugin proposé sur les sites SPIP proposé par l’académie de Caen.
Dans la configuration de votre site SPIP : dans « Configuration », « Fonctions avancées », indiquer pour proxy :
http://proxy.ac-caen.fr:8080
(si votre site est hébergé sur les serveurs du rectorat)

Partager

Imprimer cette page (impression du contenu de la page)