Sommaire
- Index
- Gras et italique
- Intertitre
- Intertitre 1
- Alignement du texte
- Note de bas de page
- Liste
- Sommaire et index
- Insertion d’une image
- Insertion d’un document audio
- Insertion d’une vidéo
- Insertion d’un tweet
- Citation
- Encadrés
- Exergue
- Lien vers un article publié sur un autre site
- Lien vers un autre article de Trognon
- Lire la suite sur un autre site
- Citer la source de l’article
Mettre un passage en gras, en italique, faire des liens, des exergues, intégrer des images, des vidéos... Tous ces petits détails facilitent largement la lecture des articles.
Sur Trognon, l’interface qui permet de publier des articles s’appelle SPIP. Elle n’est pas forcément facile d’usage, et tout ne coule pas toujours de source.
Voici donc un passage en revue de différentes fonctionnalités et les explications pour les appliquer. Si vous rencontrez des problèmes, n’hésitez pas à écrire à l’équipe de Trognon par mail [1] ou à nous laisser des messages dans le « forum » sous l’article [2].
⚠️ Cet article ne concerne que la mise en page d’un article. Il ne concerne pas les autres étapes de la proposition d’un article : créer un compte, choisir sa rubrique, ouvrir un nouvel article, trouver un titre, un descriptif, un logo, des mots-clé.
Index
- Gras et italique
- Intertitre
- Alignement du texte
- Note de bas de page
- Liste
- Sommaire et index
- Insertion d’une image
- Insertion d’un document audio
- Insertion d’une vidéo
- Insertion d’un tweet
- Citation
- Encadré
- Exergue
- Lien vers un article d’un autre site
- Lien vers un autre article de Trognon
- Lire la suite sur un autre site
- Citer la source de l’article

{ }
:- Sur mac : Alt + ’ et alt + =
- Sur windows : AltGr + ’ et AltGr + =

[ ]
: - Sur mac : alt + maj + ( et alt + maj + )
- Sur windows : AltGr + ( et AltGr + =
Dans cet article, on utilise beaucoup le mot « balise ». Une balise est une suite de lettres ou de symboles qui est ensuite interprêtée par un programme informatique et permet certains affichages spécifiques.
Gras et italique
Le gras et l’italique sont très utiles pour réussir à différencier plusieurs niveaux (ou types) d’informations dans le texte. Souvent, le gras sert à souligner des informations importantes et l’italique plutôt à signifier une forme de distance avec ce qui est dit.
Pour mettre en gras, il faut utiliser des doubles accolades :
{{ ceci est en gras }}
Donne : ceci est en gras
Pour mettre en italique, il faut utiliser des accolades simples :
{ cela est en italique }
Donne : cela est en italique
On peut accumuler les codes, par exemple du gras et de l’italique, en espaçant les accolades :
{{ {cette fois c'est en gras italique} }}
Donne : cette fois c’est en gras italique
Intertitre
Les intertitres peuvent être très importants pour structurer un texte long, par exemple un texte de réflexion. Mais aussi pour pouvoir faire un sommaire au début de l’article, et permettre aux lecteurs et aux lectrices de savoir globalement quels sont les différents points de l’article.
Trouver un titre à l’article est déjà compliqué, alors pas besoin de trop se casser la tête si on a pas trop d’idées pour les sous-titres. Annoncer simplement l’idée du paragraphe suffit, ou alors reprendre une phrase ou quelques mots.
Il existe 3 niveaux de titres différents :
{{{ Intertitre 1 }}}
donne :
Intertitre 1
{{{** Intertitre 2 }}}
donne :
Intertitre 2
{{{*** Intertitre 3 }}}
donne :
Intertitre 3
Alignement du texte
Globalement, le texte sur Trognon est aligné à gauche. C’est important pour nous de respecter ça pour avoir une charte graphique globale.
Mais il peut arriver qu’on ait envie de centrer exceptionnellement un élément pour le différencier des autres.
[|Je suis centrée !|]
Donne :
On peut aussi avoir envie d’aligner une partie à droite, par exemple pour une signature de citation.
[/Je suis à droite !/]
Donne :
Note de bas de page
Les notes de bas de pages sont très utiles quand on aimerait donner une précision sur un sujet, ou citer une source pour que les personnes puissent creuser plus loin un point précis, sans vouloir pour autant alourdir ou allonger le texte.
On peut par exemple souvent alléger un texte en mettant en bas de page des informations qu’on a mis entre parenthèses.
Et pour un site d’information, c’est souvent important de citer ses sources.
Pour faire une note de bas de page
[[Elle doit se trouver à la suite du texte entre deux crochets]]
.
Ce qui donne : Pour faire une note de bas de page [3].
Attention de bien mettre le point final, ou la virgule qui suit le mot, après les doubles crochets.
Liste
Pour lister des éléments, on peut utiliser le tiret simple, qui se transforme en un petit carré plus joli, et applique un alinéa sur le texte :
- ceci
- celà
- et bien d'autres
Donne :
ceci
celà
et bien d’autres
Ou la liste numérotée, qu’on crée avec le tiret suivi de # :
-# Et de un
-# Et de deux
-# Et de trois !
Produit une liste :
- Et de un
- Et de deux
- Et de trois !
Sommaire et index
Pour créer un sommaire automatique :
La balise <som.maire>
permet de créer un sommaire automatiquement à partir des intertitres (créer avec les balises intertitres). Ensuite, la balise <!--inserer_sommaire-->
permet de choisir où est-ce qu’on veut afficher le sommaire. Par défaut, sans cette deuxième balise, le sommaire s’affichera au tout début de l’article.
Pour réaliser un index :
L’avantage de l’index c’est de pouvoir faire des listes et des liens vers des éléments qui ne sont pas forcément des intertitres.
Pour ça, ces balises placées à un endroit dans l’article :
[Titre du premier paragraphe->#1 ]
[Titre du deuxième paragraphe->#2 ]
Créeront un lien qui conduira à ces balises plus loin :
[#1<-] Titre du deuxieme paragraphe
[#2<-] Titre du deuxieme paragraphe
Ce qui donne que ces liens :
Titre du premier paragraphe
Titre du deuxième paragraphe
Conduiront à ces balises plus loin :
Titre du deuxieme paragraphe
Titre du deuxieme paragraphe
Insertion d’une image
Sur Trognon il y a deux sortes d’images : le logo et les images qui sont dans le coeur de l’article.
Le logo est l’image qui s’affiche sur la page d’accueil et en entête de l’article. Elle est particulièrement importante parce qu’elle participe - avec le titre et le descriptif - à faire que le lecteur ou la lectrice comprennent rapidement de quoi va parler l’article. Le logo s’ajoute après avoir fini de rédiger son article. Vous pouvez aller lire « Choix et chargement du logo ».
Pour ajouter une image dans l’article. Il faut d’abord la charger sur le site, ce qui lui attribuera un numéro de document, et ensuite placer la balise avec le numéro dans l’article, à l’endroit où on veut la voir apparaitre.
Les images sont chargées grâce à l’encart « Ajouter une image ou un document » qui se trouve en haut de la colonne de gauche, ou alors en cliquant directement sur le cadre gris au-dessus « Déposer vos fichiers ici ou cliquez sur ce cadre ». L’encart « Ajouter une image ou un document » permet de charger des éléments plus lourd.
Une fois chargée, l’image s’affiche en bas de la colonne de gauche et plusieurs balises lui ont été attribuées.
<doc1|left>
affiche l’image 1 en l’alignant à gauche.
<doc2|center>
affiche l’image 2 en la centrant.
<doc3|right>
affiche l’image 3 en l’alignant à droite.
C’est aussi possible d’ajouter une légende ou un titre à l’image en cliquant sur « modifier » en dessous des balises dans la colonne de gauche.
Insertion d’un document audio
Le procédé se passe de la même manière que pour une image : il faut charger le fichier son puis intégrer la balise. Attention, la taille maximale est de 20 Mo donc c’est mieux de convertir vos fichiers en mp3 pour qu’ils soient moins lourds. Une fois chargé, vous obtenez la balise document correspondant :
Vous avez alors plusieurs possibilités d’affichage.
Vous pouvez intégrer le fichier avec la balise
<doc6830>
, ce qui fait apparaître une icône qui ouvrira la lecture dans une autre fenêtre.
Vous pouvez intégrer le fichier avec la balise
<emb6830>
, ce qui fait apparaître un lecteur son basique.
Vous pouvez transformer la balise en l’écrivant
<son6830>
, ce qui fait apparaître un encadré noir autour du lecteur, en intégrant le titre au-dessus du lecteur.
Dans tous les cas, il est important de donner un titre au fichier, surtout quand il s’agit d’un podcast qui pourrait circuler ensuite sur les plate-formes de podcasts. Pour ça, il faut cliquer sur « Modifier », sous le document dans la colonne de gauche.
Insertion d’une vidéo
Contrairement aux images et aux sons, les vidéos ne peuvent pas être chargées sur Trognon.info. Ce serait trop lourd pour le site, qui n’est globalement pas très adapté à la diffusion de vidéos...
Par contre, on peut tout à fait intégrer une vidéo d’une autre plateforme à l’intérieur d’un article.
Pour ça, il suffit de coller l’url de la vidéo - espacée d’un retour à la ligne au-dessus et en-desous - pour qu’elle s’affiche. Ça ne fonctionne pas avec toutes les plateformes vidéos, mais la plupart sont prises en charge.
https://www.youtube.com/watch?v=LwysOQFxHQQ
Donne :
Insertion d’un tweet
Parfois c’est intéressant de pouvoir intégrer un tweet, pour éviter de le citer entièrement, parce qu’il contient une vidéo ou pour ne pas être obligé·e de renvoyer les lecteurs et lectrices sur twitter.
Pour ça, il suffit de coller l’url du tweet, entre deux retours à la ligne.
https://twitter.com/DijonDTR/status/1281218474203852802
Donne :
Citation
Les citations peuvent être mises en valeur avec une balise spéciale, ce qui permet d’aérer le texte, et de faciliter la lecture de la citation.
Il suffit de mettre la citation entre deux balises <quote>
.
<quote> Trognon, tu sais, je t’aime. Tu m’as souvent permis d’échapper au désespoir, tu m’a fait sentir jeune quand j’étais vieille et toutes ces méchancetés sur les flics et la République en Marche dans tes colonnes m’ont souvent permis d’économiser les 60 balles d’une séance de psy.</quote>
Donne :
Trognon, tu sais, je t’aime. Tu m’as souvent permis d’échapper au désespoir, tu m’a fait sentir jeune quand j’étais vieille et toutes ces méchancetés sur les flics et la République en Marche dans tes colonnes m’ont souvent permis d’économiser les 60 balles d’une séance de psy.
Encadrés
On peut vouloir encadrer un texte pour résumer les informations principales de l’article, pour mettre en avant un rendez-vous de manif, pour noter des précisions techniques sur un sujet, pour signifier que c’est un communiqué d’organisation, etc.
Il y a alors deux types d’encadrés possibles.
Encadré avec fond rose
On l’utilise plutôt pour signifier une information courte, au début ou en fin d’article.
Il s’utilise avec [(
et )]
.
[(Attention : Cet article est tellement génial que vous risquez de ne plus vouloir en lire d'autres après !)]
Donne :
Encadré rouge
Ce deuxième encadré est plus sobre, et on l’utilise souvent pour les communiqué d’organisation, ou pour signifier les rendez-vous de manifestation.
Pour l’utiliser, il suffit de mettre le texte entre des balises <poesie>
.
<poesie> Rassemblement le 01 janvier devant la Cloche ! </poesie>
Donne :
Rassemblement le 01 janvier devant la Cloche !
Exergue
Un exergue est une phrase de l’article que l’on choisit de mettre en avant. Faire un exergue est une manière de casser l’aspect « bloc » d’un texte, surtout lorsqu’il est long ; mais aussi de mettre en avant une phase qui permette de faire comprendre au lecteur ou à la lectrice ce dont il est question dans le paragraphe. Il peut remplir le même rôle qu’un intertitre, sauf qu’il s’agit forcément d’une citation de l’article, et qu’on peut se donner plus de liberté puisque la citation n’a pas pour but de structurer le texte.
Pour créer un exergue, on se sert de la balise <exergue>
dans laquelle on insère le texte que l’on souhaite voir en exergue et la position de l’exergue (droite, gauche ou centré).
<exergue|texte=Mettre en exergue. Mettre en valeur, en évidence, au premier plan.|position=center>
Donne :
Mettre en exergue. Mettre en valeur, en évidence, au premier plan.
Comme la balise est un peu compliquée à retenir, on peut aussi utiliser le modèle « un exergue » dans la liste des modèles qui est proposée en bas de la colonne de gauche. Une fois renseignées les informations demandées, la balise est créée et il suffit de l’intégrer à la fin de l’article.
Lien vers un article publié sur un autre site
Même si on trouve beaucoup de choses sur Trognon, on peut parfois avoir envie de renvoyer vers d’autres sites, et particulièrement vers les sites du Réseau Mutu.
Pour ça, il faut coller l’url de l’article vers lequel on veut renvoyer dans le corps de l’article :
Allez lire [ce super article->https://rebellyon.info/Le-reseau-Mutu-la-renaissance-des-medias-19454]
Donne :
Allez lire ce super article
Lien vers un autre article de Trognon
Lorsque d’autres articles de Trognon peuvent permettre aux lecteurs et lectrices de creuser le sujet abordé, il ne faut jamais hésiter à faire un lien vers cet article. Il existe deux manières de renvoyer vers l’article.
Lien simple
Il s’agit simplement de faire un lien hypertexte dans le fil du texte. Pour ça, il faut aller récupérer le numéro de l’article vers lequel on veut renvoyer. Le plus simple est d’ouvrir l’article, le numéro est à la fin de l’url.
Par exemple si mon url est : https://trognon.info/Trognon-info-presentation-du-site-007
le numéro d’article est le 007
.
[Dans l'article de présentation de Trognon...->007]
Donne :
Dans l’article de présentation de Trognon...
Lien avec le titre de l’article
Il s’agit d’appeler le titre de l’article, avec un lien vers lui. C’est utile par exemple pour faire une liste d’articles, ou pour citer l’article au fil d’un texte.
[->007]
Donne :
Trognon.info : Présentation du site
Lien avec des encadrés
Ces liens s’utilisent plutôt pour signifier aux lecteurs et lectrices l’existence d’un article sur le même sujet, même si cet article n’est pas vraiment cité dans le texte.
On peut les intégrer dans le fil du texte, ça permet aussi d’aérer un texte long. Mais aussi à la fin de l’article pour proposer d’autres lectures.
Il existe deux styles de renvois :
<lien007>
Donne :
<articlegrand007>
Donne :
<articlegrand007>
Lire la suite sur un autre site
Lorsque l’on reprend un article d’un autre site, on préfère ne pas le mettre en entier et renvoyer le lecteur ou la lectrice au site initial pour lire l’entièreté de l’article. On met généralement le premier tiers de l’article, puis une balise spéciale qui crée un renvoi.
<ailleurs|url=https://manif-est.info|site=Manif-est>
Donne :
<ailleurs|url=https://manif-est.info|site=Manif-est>
Sinon, on peut aussi sélectionner le modèle « Lire la suite » dans la liste des modèles qui est proposée en bas de la colonne de gauche. Une fois renseignées les informations demandées, la balise est créée et il suffit de l’intégrer à la fin de l’article.
Citer la source de l’article
Plus rarement, il peut arriver qu’on souhaite reprendre l’intégralité de l’article. On peut alors utiliser une balise pour signifier sa source initiale. La balise peut être mise au choix, au début et/ou à la fin de l’article.
<source|url=https://renverse.co|site=Renverse.co>
Donne :
<source|url=https://renverse.co|site=Renverse.co>
De la même manière que pour les « Lire la suite », on peut aussi sélectionner le modèle « Source » dans la liste des modèles qui est proposée en bas de la colonne de gauche. Une fois renseignées les informations demandées, la balise est créée et il suffit de l’intégrer à la fin de l’article.
_