Charte graphique de l’état

Ligne éditoriale accessible et personnalisable

Voici quelques fonctionnalités de rédaction du texte sous SPIP avec le plugin DSFR

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 servirra de transcription
  • les crédits
  • le texte alternatif.

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

Exemple :

<doc4212|access|largeur=300>
Programme Scratch
Programme Scratch - DANE de Versailles

On commence le programme
On efface l’écran
On affiche le texte sur l’écran

Liens accessibles

Permet d’afficher une info bulle sur les liens

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

Texte cliquable

Lien en bouton

Pour transformer un lien en bouton, il faut ajouter la classe comme ceci
[ mon texte|texte info bulle-> url_page#+fr-btn+#]

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-versailles|Académie de Versailles->https://wwwac-versailles.fr#+fr-btn+#]
ac-versailles

[ac-versailles|Académie de Versailles->https://wwwac-versailles.fr#+fr-btn fr-btn--secondary+#]
ac-versailles

Les citations

<quote> Mon texte </quote>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc a magna a urna gravida tristique vitae vel ipsum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum ac orci ex.

Les blocs de code

<code>
echo "<pre>";
print_r($mesData);
< /code>

Les blocs dépliables

 <accordion>
   <title>
     Le titre du premier bloc
   </title>
   <text>
     Le texte du premier bloc
   </text>
   <title>
     Le titre du second bloc
   </title>
   <text>
     Le texte du second bloc
   </text>
 </accordion>

Exemple :

Le texte du premier bloc

Le texte du second bloc

Ressource(s) associée(s)

Autres Tutoriels

Article rédigé par Philippe ROCA