Mon site SPIP

Test odt2spip

Webmestre des sites pédagogiques — 2026-04-20T08:55:42Z

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Texte en italique

Texte en gras

Texte souligné

Texte en indice

Texte en exposant

Texte avec un lien

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Un tableau simple :

NOM	Prénom	Age
TERRIEUR	Alain	13 ans
TERRIEUR	Alex	13 ans
FAIMAL	Aïcha	16 ans
DIDON	Robin	14 ans
Capitaine		non connu

Un tableau complexe :

Colonne 1	Colonne 2	Colonne 3	Colonne 4
Cellule simple	2 cellules fusionnées verticalement	2 cellules fusionnées horizontalement
2 cellules fusionnées verticalement avec retours à la ligne	2 cellules fusionnées verticalement	Cellule simple	Cellule simple
	Cellule simple	2 cellules fusionnées horizontalement
4 cellules fusionnées horizontalement

Une liste à puces :

et un

et deux

et trois ... zéro

Une liste à plusieurs niveaux :

animaux

- vertébrés
  - mammifères
  - oiseaux
  - reptiles
  - batraciens
  - poissons
- invertébrés

végétaux

- à fleurs
  - angiospermes
  - gymnospermes
- sans fleurs
- fougères
- mousses
- algues

champignons

Une liste numérotée :

mon premier est une rondelle de saucisson sur un boomerang

mon deuxième est une rondelle de saucisson sur un boomerang
mon troisième est une rondelle de saucisson sur un boomerang
mon quatrième est une rondelle de saucisson sur un boomerang
mon ciquième est une rondelle de saucisson sur un boomerang
mon sixième est une rondelle de saucisson sur un boomerang

et mon tout est une saison

C'est le printemps parce que les six rondelles reviennent !

Popup

Webmestre des sites pédagogiques — 2026-03-04T10:50:49Z

">Article génial

Forum

Webmestre des sites pédagogiques — 2026-02-23T15:19:11Z

La page du forum

- Sous-rubrique 1

Modèle avec tableau

Webmestre des sites pédagogiques — 2026-02-03T16:43:16Z

Modèle avec boucle

Webmestre des sites pédagogiques — 2026-02-03T16:38:05Z

Rédaction avec le squelette DSFR

Les raccourcis et codes pour un texte augmenté

Un nouvel article !

Pour alimenter la newsletter - Ton écureuil, il a pris un bateau histoire de prendre le large car c'est comme ça qu'il a réussi lui ! Et Jano, il a fini la soirée chez mèmère !

Mon super article

Le descriptif du super article.

Rédaction avec le squelette DSFR

Webmestre des sites pédagogiques — 2026-01-28T09:31:02Z

Images et vidéos accessibles

Pour les vidéos ou images porteuses de sens, il faut renseigner :

le titre du document ;
le descriptif du document qui servira de transcription ;
les crédits ;
le texte alternatif.

Pour les images affichées dans les articles, il faut bien saisir la transcription dans la partie description du document. On a alors un bloc dépliable Transcription qui s'affiche en dessous de l'image.

Pour afficher le document en mode accessible, il faut ajouter l'attribut access à la balise.

Code

Modèle de code

Résultat

Écureuil automnal - Pixabay

Avec une largeur imposée

La taille du document doit être placée à la fin.

Modèle de code

Liens accessibles

Permet d'afficher une info bulle sur les liens

Code

Modèle de code

[ Texte cliquable | Texte info bulle -> http://..... ]

Résultat

Le site de la DRANE

Lien en bouton

Pour transformer un lien en bouton, il faut ajouter la classe comme ceci

Code

Modèle de code

[ mon texte|texte info bulle-> url_page#+classe+#]

Résultat

Le site de la DRANE

Classes disponibles

Vous pouvez utiliser les classes suivantes :

**fr-btn** pour un bouton bleu
**fr-btn fr-btn—secondary** pour un bouton blanc à bord bleu

Exemples :

[ac-lyon|Académie de Lyon->https://www.ac-lyon.fr#+fr-btn+#]

ac-lyon

[ac-lyon|Académie de Lyon->https://www.ac-lyon.fr#+fr-btn fr-btn--secondary+#]

ac-lyon

Les citations

Code

Modèle de code

...

Résultat

Ma citation se trouve là.

Les blocs de code

Code

Modèle de code

...

Résultat

Mes lignes de code ici

Les blocs dépliables

Code

Modèle de code

   Le titre du premier bloc   Le texte du premier bloc   Le titre du second bloc   Le texte du second bloc  ...

Il peut y avoir plusieurs groupes de blocs dans une même page

Résultat

Florence avait fini de préparer le matériel demandé par Prélude. Elle était fin prête. Elle vérifia le bon fonctionnement de la liaison entre son ordinateur portable et Internet. Prélude était bien là. A peine connecté à Internet que la voix de Prélude se fit entendre.

Dans le plancher pour savoir si quelqu'un marchait et quel poids il faisait. Le cœur pouvait alors déterminer de quelle personne il s'agissait. Dans les murs, des cellules photosensibles, des micro-caméras et tout un réseau de détecteurs divers (magnétique, pression, infrarouge...) permettait de déterminer la position exacte de chaque personne et objet dans la maison, de ventiler ou chauffer en conséquence, d'allumer ou d'éteindre la lumière...

Les onglets

Code

Modèle de code

   Le titre du premier onglet   Le texte du premier bloc   Le titre du second onglet   Le texte du second bloc  ...

Résultat

En 1975, John Holland construisit un système artificiel qui s'appuyait sur les principes de sélection de Darwin et sur les méthodes de combinaison des gènes de Mendel. L'Algorithme Génétique, ou GA, était né. Un renouveau de l'Intelligence Artificielle allait voir le jour. Les médias contribuèrent grandement à faire apprécier les machines "intelligentes" au grand public.

Aujourd'hui, c'est son anniversaire. Il a vingt-six ans, mais il ne s'en souvient plus. Il ne prête pas attention à ce genre de détails. David est un homme distrait, timide, mais sûr de lui. Il est grand et mince. De grandes mains prolongent ses longs bras. Il lui serait possible de tenir deux bouteilles de Champagne dans chacune de ses mains, mais il ne boit jamais. L'alcool le rend malade et malheureux, voir dépressif.

Cadres alert

Code

 {{{un titre}}} Le texte

Résultat

un titre

Le texte pour une alerte "error"

Code

 Le texte

Résultat

Le texte pour une alerte "success"

Code

 Le texte

Résultat

Le texte pour une alerte "warning"

Code

 Le texte

Résultat

Le texte pour une alerte "info"

Mises en exergue dans la zone de texte

Pour un Highlight classique (bordure bleue)

Code

Modèle de code

  Le texte

Résultat

Le texte

Pour personnaliser la couleur

Code

Modèle de code

 Le teste

Résultat

Le texte couleur émeraude

Article avec le mot-clé Call-Out

Webmestre des sites pédagogiques — 2026-01-27T14:20:19Z

Le texte de l'article 1
ysvukfùmqm
hxvjukvlksx !
xhckjuxmllcùm

S'inscrire à la newsletter

Webmestre des sites pédagogiques — 2026-01-27T14:15:57Z

Solution 1

La plus complète et la plus paramétrable.
On obtient ce résultat en utilisant le plugin "Formidable" et l'add-on "Formidable : abonnements à des listes de diffusion".

Solution 2

Ultra simple avec le formulaire inclus dans le plugin "Mailsubscribers".
Par contre les cases sont toutes cochées par défaut et les CSS ne sont pas top.
Donc si vous optez pour cette solution, n'hésitez pas à me demander les petites modifications que j'ai faites pour d'autres.

Article sans extrait

Webmestre des sites pédagogiques — 2026-01-20T14:52:00Z

Test

Pour tester comment le modèle gère les articles qui n'ont pas d'extrait, je rédige cet article.

En principe le modèle devrait couper le début de l'article, mais pas sûr ;)
Par contre, dans ce cas, on perd le formatage
et les retours à la ligne.

Apparemment les retours à la ligne sont conservés.

Suite de l'article

Tous les dix mètres, une pancarte indiquait que ce grillage était électrifié. Un petit chemin longeait les grillages de chaque côté et l'on pouvait y voir de temps en temps deux gardes armés faire leur ronde. La route semblait interminable. Caillouteuse à souhait. Au-delà des grillages, c'était la forêt. Une forêt bien entretenue, presque artificielle pensa David.

« Prélude m'avait dit qu'il désirait connaître l'amour. Les ordinateurs n'ont pas de sentiments et l'amour n'est que sentiments. Il y a bien l'amour physique, mais sans les sentiments, cela ressemble davantage à un instinct de reproduction qu'à de l'amour. Un ordinateur n'a pas ce besoin de reproduction. Et pourquoi m'avoir choisi ? »

David se rappelait de ce programme mélangeant deux anciennes technologies. Il s'en souvenait très bien, cinq années de travail acharné pour réaliser un vieux rêve d'enfant un peu solitaire. Il voulait un ami et il avait trouvé en l'informatique la possibilité d'avoir cet ami. Un ami capable de réfléchir vite, exempt de sentiment.

D'ailleurs, le Dr. ne savait pas vraiment comment son processeur pouvait fonctionner. D'une architecture trop complexe, le Dr. s'était reposé sur les tests effectués. Tests très légèrement modifiés par Prélude afin de cacher certaines fonctions du processeur.

Mon article

Webmestre des sites pédagogiques — 2026-01-17T10:53:00Z

Mon site SPIP

Test odt2spip

Un tableau simple :

Un tableau complexe :

Une liste à puces :

Une liste à plusieurs niveaux :

Une liste numérotée :

Popup

Forum

Modèle avec tableau

Modèle avec boucle

Rédaction avec le squelette DSFR

Un nouvel article !

Mon super article

Rédaction avec le squelette DSFR

Images et vidéos accessibles

Code

Modèle de code

Résultat

Écureuil automnal - Transciption

Avec une largeur imposée

Modèle de code

Liens accessibles

Code

Modèle de code

Résultat

Lien en bouton

Code

Modèle de code

Résultat

Classes disponibles

Exemples :

Les citations

Code

Modèle de code

Résultat

Les blocs de code

Code

Modèle de code

Résultat

Les blocs dépliables

Code

Modèle de code

Résultat

Le titre du premier bloc

Le titre du second bloc

Les onglets

Code

Modèle de code

Résultat

Cadres alert

Code

Résultat

un titre

Code

Résultat

Code

Résultat

Code

Résultat

Mises en exergue dans la zone de texte

Pour un Highlight classique (bordure bleue)

Code

Modèle de code

Résultat

Pour personnaliser la couleur

Code

Modèle de code

Résultat

Article avec le mot-clé Call-Out

S'inscrire à la newsletter

Solution 1

Solution 2

Article sans extrait

Test

Suite de l'article

Mon article