]]>

Les raccourcis SPIP

Publié samedi 17 octobre 2015
Dernière modification dimanche 1er mars 2015
Article lu 269 fois

Par Mel

Le site www.fantastikindia.fr utilise le logiciel SPIP pour créer, gérer et afficher les articles. Son backoffice intègre un éditeur assez rudimentaire permettant aux rédacteurs de saisir leurs chroniques. À l’inverse de la plupart des logiciels de traitement de texte, l’interface qui nous est offerte n’est pas wysiwyg, c’est à dire qu’il n’affiche pas le texte tel qu’il sera rendu à l’écran. C’est au moment de l’affichage sur le site que SPIP construit dynamiquement la page en suivant les règles propres à Fantastikindia et en s’appuyant sur les raccourcis typographiques insérés par le rédacteur. Cela peut apparaître pour une régression en cette fin d’année 2012, mais au même titre que LaTeX ou le langage de Wikipedia, ce système présente quelques précieux atouts.

Le premier est la maintenabilité. Un texte écrit de cette façon pourra être repris sans difficulté dans plusieurs années, quelque soit l’évolution des logiciels et des systèmes d’exploitation. Il se trouvera toujours un éditeur de texte à portée de main pour retoucher un article. Le second avantage est lié à la philosophie promue par les auteurs de SPIP : le sens est à la charge des auteurs, la forme est sous la responsabilité du site. Ceci permet d’uniformiser la présentation des articles et renforce l’unité visuelle du site. Enfin, même s’il ne l’interdit pas formellement, ce système limite les risques de présentations « olé-olé » qui sont en réalité autant de freins à une lecture agréable.

Les chroniques de Fantastikindia ont pour but non seulement d’éclairer le lecteur dans l’instant, mais également de servir de base documentaire. A ce titre, elles doivent être écrites dans un français soutenu ; ce qui n’exclut pas la fantaisie, lorsqu’elle est maîtrisée. Il en va de même avec la typographie, c’est à dire les conventions de composition du texte comme la constitution des abréviations, les règles d’utilisation des majuscules ou de la ponctuation pour n’en citer que quelques-unes. Ainsi, la typographie vise à faciliter la lecture en procurant un cadre homogène évitant les ambiguïtés.

Certes, nous ne sommes pas des écrivains professionnels et SPIP n’est pas une plateforme de publication qui fait autorité. Mais l’application de quelques règles simples [1] permet d’obtenir des résultats très satisfaisants, et SPIP est alors l’outil idéal pour les mettre en œuvre.

La syntaxe SPIP

Même si le rédacteur doit éviter autant que possible ce qui est de l’ordre de la mise en page au profit du texte lui-même, un article contient bien souvent d’autres éléments qu’une succession de caractères. C’est le cas des enrichissements tels que les renvois hypertexte, les illustrations, les tableaux, les listes numérotées ou à puce et les lignes de séparation. De plus, certaines parties du texte nécessitent parfois des indications pour être rendues correctement. Il s’agit des titres ainsi que des mises en italique et en gras. Enfin, certains symboles non accessibles sur le clavier requièrent une syntaxe particulière pour être utilisés dans le texte. La version actuelle de SPIP propose ainsi par exemple l’espace insécable et le tiret cadratin.

D’autres enrichissements typographiques sont utilisables en insérant du code HTML directement dans le texte. A quelques rares exceptions près, cette méthode est à proscrire autant que possible, car elle va à l’encontre de la philosophie même du système qui est de laisser la mise en page sous le contrôle exclusif du site afin d’homogénéiser sa présentation. A titre d’exemple, supposons qu’un rédacteur souhaite changer la couleur du texte — ce qu’il est possible de faire en insérant le code HTML adéquat. Ce texte coloré, bien visible sur le fond de page actuel du site, pourrait devenir illisible si la charte graphique du site venait à évoluer [2]

Tous ces enrichissement typographiques sont indiqués en insérant des caractères spéciaux dans le texte. Ils sont conçus de manière à être le moins intrusifs possibles pour ne pas gêner la rédaction. Dans plupart des cas, seules des accolades supplémentaires sont ajoutées, mais des successions de caractères plus complexes sont nécessaires pour des éléments comme les liens hypertexte par exemple. Ce texte détaille les principales possibilités qui nous sont offertes. Il s’accompagne d’un memento qui évitera de devoir lire ma prose longue et souvent ampoulée, ainsi que d’une page de test qui reprend l’intégralité de la syntaxe de SPIP offerte sur le site.

Syntaxe des enrichissements usuels

Les éléments constitutifs de base d’un article sont les paragraphes avec la gestion particulière des espaces et des tirets. Ils sont enrichis par la mise en gras ou en italique de certaines expressions et se voient complétés par des liens hyper-texte et des illustrations.

Les paragraphes

Le lecteur identifie la séparation entre les paragraphes par un saut de ligne. Or, et c’est la première source d’interrogation d’un rédacteur novice : le passage à la ligne obtenu par la touche Entrée du clavier ne suffit pas. SPIP considère tout simplement qu’un paragraphe est délimité par une ou plusieurs lignes vides qu’il réduira à une seule. Voici un exemple de deux paragraphes qui s’enchaînent :

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi a felis non lorem venenatis lacinia id et ante. Donec feugiat dapibus mauris vitae ornare. Praesent sed odio quis libero dapibus sollicitudin in a arcu.



Vestibulum scelerisque velit sed purus euismod pharetra. Nullam rutrum mi eget nunc consectetur feugiat. Mauris varius diam vitae libero pellentesque sagittis. Pellentesque euismod cursus suscipit.

Le résultat à l’écran est le suivant :

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi a felis non lorem venenatis lacinia id et ante. Donec feugiat dapibus mauris vitae ornare. Praesent sed odio quis libero dapibus sollicitudin in a arcu.

Vestibulum scelerisque velit sed purus euismod pharetra. Nullam rutrum mi eget nunc consectetur feugiat. Mauris varius diam vitae libero pellentesque sagittis. Pellentesque euismod cursus suscipit.

Les espaces

SPIP concatène les espaces et ignore les passages à la ligne pour éviter au rédacteur de s’en préoccuper. En pratique, plusieurs espaces consécutives sont considérées comme une seule, et les passages à la ligne sont ignorés. Le texte suivant, truffé d’espaces et de passages à la ligne abusifs :

Lorem ipsum dolor           sit amet, consectetur adipiscing elit.           Morbi a felis non lorem venenatis lacinia id et ante.
Donec           feugiat dapibus              mauris vitae ornare.
Praesent sed odio quis libero dapibus sollicitudin in a arcu.

donnera ce résultat une fois mis en page par SPIP :

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi a felis non lorem venenatis lacinia id et ante. Donec feugiat dapibus mauris vitae ornare. Praesent sed odio quis libero dapibus sollicitudin in a arcu.

La typographie française propose deux sortes d’espaces : les espaces simples tels qu’ils sont obtenus avec la barre d’espace du clavier, et les espaces insécables qui ne peuvent être coupés en fin de ligne car ils font partie en réalité des mots qui les encadrent. SPIP insère automatiquement des espaces insécables devant les signes de ponctuation « : ; ! ? », et place des espaces insécables avant et après les guillemets « à la française ». Il ne gère pas en revanche ceux qui doivent être placés à la suite de « ,... » ni en ouverture et fermeture d’incise. Pour ces cas rares, le symbole « ~ » (AltGr + 2) permet de forcer l’insertion d’une espace insécable aux endroits désirés.

Les tirets

La typographie considère trois formes de tiret : le trait d’union, le signe moins, et le tiret cadratin ou tiret long. Le clavier n’en permet qu’un seul, placé sous le 6, qui est utilisé indifféremment pour signifier le trait d’union et le signe moins. Il ne permet donc pas d’insérer de tiret cadratin. C’est pour combler ce manque que SPIP propose le symbole « -- ».

Il peut être utilisé pour marquer les répliques d’un dialogue comme dans l’exemple suivant :

-- Qu’est arrivé à Sonia ? Le sang suinte dehors. Appelez le docteur.
-- Y en a-t-il qui a envoyé pour une ambulance ou pas ?
-- Que s’est produit, mère ? Quelqu’un... appel le docteur !

produisant ce résultat :

— Qu’est arrivé à Sonia ? Le sang suinte dehors. Appelez le docteur.
— Y en a-t-il qui a envoyé pour une ambulance ou pas ?
— Que s’est produit, mère ? Quelqu’un… appel le docteur !

Il sert également à délimiter les incises comme dans cette phrase tirée de la chronique de Bandit Queen (notez les espaces insécables en début et fin d’incise) :

Ce parti pris réaliste et militant du réalisateur --~l’histoire est toujours présentée du point de vue de la protagoniste féminine~-- fait de Bandit Queen un film parfois éprouvant à regarder d’autant plus qu’il y a surenchère dans les outrages que Phoolan Devi subit depuis l’enfance jusqu’à l’âge adulte.

qui donne ce résultat une fois mis en page par SPIP :

Ce parti pris réaliste et militant du réalisateur — l’histoire est toujours présentée du point de vue de la protagoniste féminine — fait de Bandit Queen un film parfois éprouvant à regarder d’autant plus qu’il y a surenchère dans les outrages que Phoolan Devi subit depuis l’enfance jusqu’à l’âge adulte.

Gras et italique

La mise en gras est utilisée exclusivement sur Fantastikindia pour marquer les titres des œuvres comme les titres de films, de livres ou de pièces de théâtre. Il est obtenu en encadrant le texte d’accolades doubles, comme {{Kuch Kuch Hota Hai}} qui donne Kuch Kuch Hota Hai.

L’italique sert à marquer les différences : mots étrangers, emphase, titres des chansons, etc. Il est obtenu en encadrant le texte d’accolades simples, comme {Aa Re Pritam Pyaare} qui donne à l’écran Aa Re Pritam Pyaare.

Il est très vivement déconseillé de combiner gras et italique car cela ne correspondant à aucun usage courant. C’est cependant possible en insérant un caractère entre les séries d’accolades. Ainsi {{ {Pourquoi mélanger gras et italique ?} }} donnera Pourquoi mélanger gras et italique ? . Le caractère inséré ici est une espace simple, mais on pourrait parfois vouloir utiliser un autre symbole comme le « . » ou l’espace insécable.

Liens hypertexte

Les chroniques sont agrémentées de liens hypertexte qui renvoient le lecteur vers d’autres contenus. La syntaxe générale d’un lien dans le langage SPIP est la suivante : [texte du lien|texte de la bulle->adresse du lien#ancre nommée] :

  • l’adresse du lien peut être une adresse Web ou le numéro d’un article du site. Cette adresse peut être la page de l’article ou une ancre nommée au sein de l’article. L’usage des ancres est optionnelle est n’est pas utilisée sur Fantastikindia. À défaut de lien, l’adresse est la page en cours de lecture, ce qui peut être utilisé pour naviguer au sein de la page.
  • le texte du lien sera rendu en bleu et tous les enrichissements typographiques sont utilisables. On choisira par exemple la mise en gras lorsqu’il s’agit de faire référence à un film.
  • la bulle d’aide s’affiche lorsque la souris passe sur le texte du lien. C’est un élément optionnel qui n’est présent actuellement dans aucune chronique du site. Il est à noter qu’aucun enrichissement typographique n’est possible dans les bulles d’aide.

Voici un exemple des plus banal, la référence à une chronique de film : [{{Cocktail}}->4885] qui sera rendu en Cocktail. On peut même l’agrémenter d’une bulle d’aide : [{{Cocktail}}|Jolies filles à Londres->4885] affiché comme : Cocktail.

Enfin, deux autres éléments du site peuvent faire l’objet de liens :

  • les rubriques avec la syntaxe [rubrique->rubXXX] où XXX est l’identifiant de la rubrique (100 pour les biographies par exemple)
  • les auteurs avec la syntaxe [auteur->autXX] où XX est l’identifiant de l’auteur (79 pour Mel par exemple)
Images

Toutes les chroniques de Fantastikindia sont agrémentées d’illustrations. Celles-ci sont chargée dans la base de donnée du site et appelées dans le corps du texte. Ces images sont identifiées dans le système par un numéro assigné lors de leur chargement, et c’est ce numéro qui sera utilisé lors de l’appel.

Deux syntaxes d’appel d’une illustration sont possibles :

  • <imgXXXX|position> où « XXXX » est le numéro du document et « position » la position de l’image par rapport au texte. Ce champ optionnel peut valoir center (position par défaut) pour centrer l’image, right pour caler l’image à droite avec le texte placé à gauche ou left pour caler l’image à gauche avec le texte placé à sa droite.
  • <docXXXX|position> où « XXXX » est le numéro du document et « position » la position de l’image par rapport au texte. La seule différence avec la syntaxe précédente est l’affichage de la légende sous l’illustration. Cette légende a été remplie dans le champ « Titre de l’image » lors du chargement de l’image (il est possible de la modifier après-coup).

La plupart des articles utilisent l’affichage centré car il ne pose pas de problème de mise en page, au contraire de l’affichage à droite ou à gauche qui peut être parfois délicat. La difficulté réside dans le fait que la mise en page est modifiée pour tout le texte qui « coule » à droite (ou à gauche) de l’illustration. En effet, SPIP complète le texte à droite ou à gauche jusqu’en bas de l’illustration, ce qui peut inclure des paragraphes non désirés et même des intertitres. Il est possible d’éviter ce problème en ajustant la hauteur de l’image, en ajustant la longueur du texte qui coule à droite (ou à gauche), voire même en sautant des lignes. Mais dans tous les cas, c’est une opération assez pénible qui demande de vérifier la mise en page.

Il est possible d’avoir des illustrations simultanément à droite et à gauche. Mais on préférera une alternance droite/gauche comme dans la biographie de Kalki Koechlin. Enfin, les images sont rendues cliquables en utilisant la syntaxe standard des liens hypertexte.

Voici donc un exemple d’insertion d’illustrations. La première image est affichée à l’aide de la syntaxe <doc22645|center> de manière à afficher la légende. Les deux suivantes sont produites par la syntaxe <img22645|left>  [<img22645|right>->3793] suivie du texte de Virgile « Lorem ipsum… ». L’image de droite est donc cliquable et renvoie à la chronique du film dont elle est tirée.

JPEG - 15.6 ko
Une bien jolie photo

Une bien jolie photo Une bien jolie photo Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla neque metus, lacinia scelerisque mattis auctor, lobortis a erat. Aliquam sit amet facilisis elit. Suspendisse elementum cursus felis, vel viverra lectus convallis eget. Fusce luctus lectus condimentum lacus eleifend elementum.

Integer id arcu lobortis velit dapibus lobortis eu sed mauris. Nulla molestie ante non est ultrices in vestibulum justo viverra. Nullam ut mi ut tellus rhoncus tempus id id enim. Donec tincidunt leo nec orci varius euismod. Praesent condimentum ante dolor. Fusce sollicitudin, quam non fringilla vestibulum, massa diam molestie nunc, vel sagittis libero odio eu purus.

Vidéos

Les illustrations intégrées aux articles ne se limitent pas aux images fixes. Il est également possible d’agrémenter le texte de vidéos. Grâce à une syntaxe propre à Fantastikindia, ceci peut être réalisé sans qu’il soit nécessaire d’avoir recours à l’utilisation de codes HTML non maintenables. Les vidéos peuvent être :

  • hébergées par le site, et donc téléversées comme n’importe quel document (une interface particulière peut être requise si la taille de la vidéo est importante)
  • provenir de Youtube, Dailymotion ou Vimeo

Dans tous les cas, les vidéos seront affichées centrées et en pleine largeur de la zone d’affichage de l’article. Par conséquent le rédacteur n’aura à fournir que :

  • une identification de la vidéo pour que le système puisse la jouer
  • une indication du rapport hauteur/largeur pour que des bandes noires abusives ne soient pas ajoutées. Pour des raisons de compatibilité avec l’ancienne version du site, la largeur sera de préférence spécifiée à 560 pixels. Le calcul de la hauteur dépend du rapport hauteur/largeur de la vidéo. Pour une vidéo 16/9 (le plus courant), la hauteur spécifiée sera de 315 pixels car 560/315 = 16/9. Pour une vidéo 4/3 (les films anciens par exemple), la hauteur spécifiée sera de 420 pixels car 560/420 = 4/3.

Il reste l’identification de la vidéo. Pour les vidéos hébergées sur le site, il s’agit du numéro du document comme pour les images. La syntaxe est <videoXXXX|largeur=L|hauteur=H> avec L et H calculés comme indiqué précédement. Cela donne par exemple pour cette vidéo 16/9 :

La syntaxe est presque la même pour les vidéos hébergées par Youtube : <youtube|id=ABCDE|largeur=L|hauteur=H>. L’URL de cette chanson est https://www.youtube.com/watch?v=ZTmF2v59CtI. Son identifiant est donc « ZTmF2v59CtI ».

Voici donc ce que donne <youtube|id=ZTmF2v59CtI|largeur=560|hauteur=315> :

Idem pour Dailymotion qui héberge la chanson à l’adresse http://www.dailymotion.com/video/xpxoe9_sheila-ki-jawani-full-song-tees-maar-khan_shortfilms. La syntaxe <dailymotion|id=xpxoe9_sheila-ki-jawani-full-song-tees-maar-khan_shortfilms|largeur=560|hauteur=315> donne :

Enfin, le principe est le même pour Vimeo qui héberge la même chanson (vous devez en avoir assez…) à l’adresse suivante : https://vimeo.com/83139246. La syntaxe à utiliser dans l’article est ici <vimeo|id=83139246|largeur=560|hauteur=315> qui donne :

Syntaxe avancée

Le chapitre précédent décrivait la syntaxe suffisante dans l’immense majorité des cas. SPIP offre cependant des possibilités supplémentaires. En voici quelques-unes.

Quelques enrichissements typographiques particuliers

Les mises en gras et en italique sont les deux seuls enrichissement typographiques proposés dans le langage de SPIP. On peut cependant aussi utiliser quelques symboles propres au langage HTML pour obtenir des effets additionnels. En voici la liste :

  • Mise en exposant, obtenue en encadrant le texte par <sup></sup> comme M<sup>elle</sup> qui donne Melle. La mise en exposant est utile pour écrire des abréviations et des unités comme m2.
  • Mise en indice, obtenue en encadrant le texte par <sub></sub> comme C<sub>2</sub>H<sub>6</sub>O qui donne le bon vieil éthanol : C2H6O. Il ne semble pas que la mise en indice puisse trouver un usage sur le site Fantastikindia.
  • Texte biffé, obtenu en encadrant le texte par <del></del> comme <del>rature</del> qui donne rature. Le texte biffé permet d’obtenir un effet comique comme dans la chronique de Magadheera.
  • Texte souligné, obtenu en encadrant le texte par <u></u> comme <u>incompréhensible et source de confusion</u> qui donne : incompréhensible et source de confusion. Le texte souligné est très vivement déconseillé car il se confond avec les liens hypertextes.
Passage à la ligne

Autant le dire clairement, SPIP n’aime pas, mais alors pas du tout, que les rédacteurs s’occupent de la mise en page. En conséquence, il met autant de bâtons dans les roues que possible pour éviter que que nous puissions sauter des lignes. Les justifications sont nombreuses, mais on ne peut guère faire autrement dès lors qu’on souhaite insérer des images en enluminures (à droites ou à gauche). Voici donc l’état actuel de ce que nous faisons pourtant sans y penser avec la touche Entrée de notre clavier.

SPIP autorise le retour au début de la ligne en utilisant la syntaxe « _  » (underscore suivi d’une espace) placée en début de nouvelle ligne. Un retour au début de la ligne de ce type ne signe pas un nouveau paragraphe, on est juste passé à la ligne, produisant ainsi un texte compact et bien souvent difficile à lire. Un second retour à la ligne avec « _  » ne fera rien, car on est déjà au début de la ligne. Il ne permet donc pas de "sauter des lignes".

Tel n’est pas le cas avec le tag HTML « <br> » qui permet le retour à la ligne suivante. Par conséquent, un enchaînement de « <br> », un seul au début de chaque ligne [3], permet de de sauter des lignes. Mais « <br> » des inconvénients majeurs : il est proprement illisible dès lors que plusieurs lignes sont à sauter et son comportement semble souvent imprévisible, sans compter qu’il pose des problèmes de validation HTML. Il est donc très vivement déconseillé.

Alors, simplement pour sauter des lignes, Fantastikindia propose « <crlf n> » où n est le nombre de lignes à sauter. Cela ne fait que ça, sans effets de bords désagréables. Par exemple, Texte avant <crlf 3> texte après saute trois lignes au sein du même paragraphe :
Texte avant


texte après

Et pour obtenir un paragraphe composé d’exactement n lignes vides, il suffit d’écrire « <crlf n> » seul sur sa ligne, précédé et suivi de lignes vides.

Cela résout le problème consistant à « sauter des lignes » mais ce n’est pas nécessairement ce que l’on souhaite faire. Si un image est placée en enluminure (ou plusieurs comme dans l’exemple plus haut), le texte « coule » autour des images. Pour revenir à la ligne, il faut passer les images. Sauter des lignes est possible mais il faut s’assurer alors que le nombre de lignes convient. Si la mise en page venait à changer ou que la taille des caractères ou des images venaient à changer, la nombre de lignes « à sauter » serait à revoir.

Le petit tag « <nl> » règle cette difficulté. Il termine le paragraphe (s’il y a lieu) et renvoie à la ligne, qu’il y ait des images enluminés ou non. Il a été créé pour réaliser la page des Partenaires où l’on peut voir son efficacité.

Titres

Au départ, seul un intertitre était défini. Il est obtenu en encadrant le texte de trois accolades, comme dans l’exemple suivant : {{{exemple d'intertitre}}}. Les intertitres de cet article utilisent cette syntaxe.

Un seul niveau de titre est suffisant pour la majorité des articles — la plupart n’ont même pas besoin de titre inséré dans le texte —, mais ce n’est pas le cas par exemple de ce tutoriel.

C’est pourquoi deux niveaux de titre supplémentaires ont été ajoutés. Ils sont obtenus avec les codes {{{**Titre de niveau 1}}} et {{{***Titre de niveau 2}}} respectivement. Cet article utilise l’intertitre et le titre de niveau 2.

Notes de bas de page

SPIP propose une syntaxe spécifique pour gérer automatiquement les notes de bas de page. Il suffit simplement de placer la notre la note entre deux doubles-crochets : [[voici une note de bas de page]].

Il est également possible de forcer un numéro ou de donner un nom à la note en l’ajoutant de la façon suivante : [[<nom ou numéro de la note>texte de la note]].

Listes

Deux types de liste sont disponibles : les listes à puce et les listes numérotées. Dans les deux cas, elles doivent être suivies d’une ligne vide pour les dissocier des paragraphes qui suivent.

Leur syntaxe est également très simple : la première ligne de chaque entrée doit débuter par un tiret suivi d’une étoile puis d’un espace. Le nombre d’étoiles défini le niveau d’indentation et dans l’exemple qui suit, les trois niveaux possibles sont décrits :

-* entrée 1
-* entrée 2
-** entrée 2a
-*** entrée 2a1
-** entrée 2b
-* entrée 3

L’affichage obtenu est le suivant :

  • entrée 1
  • entrée 2
    • entrée 2a
      • entrée 2a1
    • entrée 2b
  • entrée 3

Lorsque la liste n’a qu’un seul niveau, on peut se contenter d’un seul tirer en début de ligne comme dans l’exemple :

- entrée 1
- entrée 2

qui est rendu de la façon suivante :

  • entrée 1
  • entrée 2

Les listes numérotées suivent le même principe en remplaçant le caractère ’*’ par un ’#’. Trois niveaux d’indentation sont également disponibles :

-# entrée 1
-# entrée 2
-## entrée 2a
-### entrée 2a1
-## entrée 2b
-# entrée 3

produira l’affichage suivant :

  1. entrée 1
  2. entrée 2
    1. entrée 2a
      1. entrée 2a1
    2. entrée 2b
  3. entrée 3
Tableaux

La réalisation des tableaux utilise une syntaxe très simple, mais qui s’avère être un cauchemar à mettre en oeuvre dès que le tableau est un peu long. Ils sont cependant utilisables et en voici la syntaxe.

Les tableaux sont composés de lignes contenant le même nombre de cases. Ces dernières sont séparées par le caractère « | » (sous le chiffre 6 sur le clavier). La première ligne est la ligne de titre si toutes les cases sont en gras. Le tableau peut être précédé d’une légende encadrée par les deux caractères « || ».

Voici un exemple agrémenté de liens hypertexte :

||Quelques vedettes||
| {{Nom}} | {{Date de naissance}} | {{Lieu de naissance}} |
| [Shah Rukh Kahn->896] | 02/11/1965 | New-Dehli|
| [Rajinikanth->2178] | 12/12/1949 | Bangalore|
| [Sridevi->1941]| 13/08/1963 | Sivakasi|
| [Kajol->1107]| 05/08/1975 | Bombay |

qui est rendu de la façon suivante :

Quelques vedettes
Nom Date de naissance Lieu de naissance
Shah Rukh Kahn02/11/1965New-Dehli
Rajinikanth12/12/1949Bangalore
Sridevi13/08/1963Sivakasi
Kajol05/08/1975Bombay

Il est possible de s’amuser à fusionner des cellules à l’aide des caractères ’^’ (fusionner avec la cellule du dessus) et ’<’ (fusionner avec la cellule de gauche), mais le rendu visuel n’est pas très satisfaisant.

Lignes de séparation

Un article peut être séparé en plusieurs parties à l’aide de lignes horizontales qui couvrent la largeur de la page. Un des usage est l’indication claire de l’ajout d’une bande annonce comme dans la chronique de Jusqu’à Mon Dernier Souffle. La ligne de séparation est signalée grâce à quatre tirets consécutifs placés seuls sur une ligne. La syntaxe ---- donne donc :


Mise en forme de blocs

Des blocs de texte peuvent bénéficier d’une mise en page particulière, il suffit pour cela de les encadrer du code adéquat. Ces formatage n’ont normalement pas d’usage sur Fantastikindia, mais à toute fin utile, voici leur description.

  • code : dans ce mode, le texte est écrit dans une police à chasse fixe et les codes SPIP comme HTML ne sont pas interprétés. L’utilité première de cette mise en page est l’affichage de code informatique, mais ce texte en fait un usage abondant pour décrire la syntaxe utilisable dans les articles. Il est obtenu en encadrant le texte par <code> et sa fermeture HTML qui ne peut pas être rendue dans cet article car il n’existe pas de caractère d’échappement dans le langage SPIP.
  • poésie : le texte des poésies est rendu indenté, avec une ligne verticale à gauche et en passant à la ligne à chaque vers. Il est obtenu en encadrant le texte par <poesie></poesie>. Voici un exemple :
Maître Corbeau, sur un arbre perché,
Tenait en son bec un fromage.
Maître Renard, par l’odeur alléché,
Lui tint à peu près ce langage :
"Hé ! bonjour, Monsieur du Corbeau.
Que vous êtes joli ! que vous me semblez beau !
Sans mentir, si votre ramage
Se rapporte à votre plumage,
Vous êtes le Phénix des hôtes de ces bois. "
A ces mots le Corbeau ne se sent pas de joie ;
Et pour montrer sa belle voix,
Il ouvre un large bec, laisse tomber sa proie.
Le Renard s’en saisit, et dit : "Mon bon Monsieur,
Apprenez que tout flatteur
Vit aux dépens de celui qui l’écoute :
Cette leçon vaut bien un fromage, sans doute. "
Le Corbeau, honteux et confus,
Jura, mais un peu tard, qu’on ne l’y prendrait plus.
  • citation : ce mode est conçu pour insérer des citations. Il est obtenu en encadrant la citation par <quote></quote>. En voici un exemple :

    Cogito ergo sum

  • cadre : ce mode est destiné à insèrer une portion de texte non mis en forme, c’est à dire sans interprétation des codes SPIP ou HTML, dans un cadre équipé d’une poignée. Il est obtenu en encadrant la texte par <cadre></cadre>. En voici un exemple :

[1Internet regorge de documents décrivant en détail la typographie française. Le guide en ligne de la société Synapse Développement est très complet et permet les recherches sur un point particulier. Le document suivant constitue quant à lui un guide général plein de bon sens et d’une lecture agréable.

PDF - 595.6 ko
Petites leçons de typographie

[2Cet exemple hypothétique est en réalité très concret. La première photo du test du DVD du film Dushman utilise la couleur du fond de page pour faire croire que deux photos sont insérées horizontalement, alors qu’en réalité, il s’agit d’une seule et même image. L’auteur de ce petit trucage s’est cru bien malin, mais si jamais le fond de page du site venait à devenir blanc par exemple, on verrait une tache bleue hideuse entre les deux DVD.

[3Plusieurs « <br> » sur la même ligne sont considérés comme un seul, ce qui est une source de confusion importante pour le rédacteur (et l’auteur de ces lignes)

Commentaires
Pas encore de commentaires