Un bout de texte en gras, un titre mis en avant, une image placée à gauche/droite, ou encore de jolies notes de bas de pages rendent toujours la lecture plus agréable, facile et donc accessibles à tout·e·s. Les outils de publication sur IAATA.info et les autres sites du réseau Mutu ne sont pas faciles à maîtriser mais sont assez complets.
Pour expliquer tout ceci, voici un article quasi exhaustif sur les possiblités offertes pour mettre en page un article sur IAATA. L’article contient un sommaire cliquable pour accéder directement à une partie qui vous intéresserait.
Le collectif d’animation du site reste disponible si vous avez des soucis ou des questions pour la mise en forme de vos articles grace au forum sous chaque article dans la partie privée.
Bonne lecture, et bonne écriture !
A savoir avant de commencer
Le site IAATA.info est codé avec un langage informatique appelé SPIP. Ce qui nous impose quelques règles dans l’usage de la typographies. [1]
Cet article va, entre autres, présenter les différentes manières d’intégrer un fichier dans un article. Nous recommandons à tout·e·s les contributrices et contributeurs du site de lire la première partie de cet article qui concernent les métadonnées et les moyens de les supprimer !
Vous pouvez aussi aller sur cette page internet pour vous entrainer à utliser la typographie SPIP sans risquer de bousiller votre article !
N’oubliez pas qu’à n’importe quel moment vous pouvez enregistrer votre article en cours d’écriture puis cliquer sur prévisualiser (en haut à gauche sous le numéro de l’article) pour vérifier que l’article est bien lisible.
Il est également possible de rédiger son article tout en visualisant le résultat final. C’est très pratique pour éviter les aller-retour dans la partie édition et les balises ouvertes mais jamais fermées !
La plupart des outils détaillés en suivant peuvent être utilisés en passant par les boutons disponibles dans la partie supérieur du cadre d’édition. Mais leur utilisation manuel sera plus rapide une fois que vous en serez familier.
Les outils que nous allons utiliser se servent souvent de balise. Ces balises vont toujours par paire : une balise pour activer la mise en forme, une seconde pour la terminer. Nous détaillerons les balises à utiliser en les mettant d’abord ce que l’on appel leur code qui apparaitra sous cette forme .
Puis à la suite nous mettrons le résultat.
Pour utiliser ces balises savoir taper certains caractères du clavier est indispensable.
Pour mettre en gras ou en italique du texte, on va utiliser les accolades { et }
Pour obtenir une accolade avec votre clavier :
alt + ( pour ouvrir {
alt + ) pour fermer } - sur Windows :
AltGr + ( pour ouvrir {
AltGr + ) pour fermer } - sur Linux :
AltGr + 4 pour ouvrir {
AltGr + = pour fermer } Pour obtenir un crochet avec votre clavier :
Alt + Maj + ( pour ouvrir [
Alt + Maj + ) pour fermer ] - sur Windows :
AltGr + 5 pour ouvrir [
AltGr + ° pour fermer ] - sur Linux :
AltGr + 5 pour ouvrir [
AltGr + ° pour fermer ] Les signes inférieur à et supérieur à < > sont aussi très utilisés. De même que le slash vers l’avant / utilisé lui pour refermer la mise en fome.
L’étoile est utilisé pour gérer les différents niveaux de titres et d’intertitres.
*
Voilà vous maitrisez ce qu’il faut pour embellir vos articles. C’est parti !
Gras, italique, etc.
{ ce texte là est en italique }
ce texte là est en italique
{{ celui ci est en gras }}
celui ci est en gras
<u>on peut aussi souligner</u>
on peut aussi souligner
ou bien <del>barré</del> biffer du texte
ou bien barré biffer du texte
On peut évidement accumuler les codes. Si l’on veut par exemple du gras et de l’italique il suffit d’espaer les accolades.
{{ {cette fois c'est en gras italique} }}
cette fois c’est en gras italique
A savoir, les raccourcis claviers habituels Ctrl+b, Ctrl+i pour respectivement mettre en gars ou en italique fonctionne dans la page d’édition !
Pour modifier la taille et la couleur, on utilise la balise FONT size pour la taille ou FONT color pour la couleur
La taille varie de 1 à 7 qui correspondent respectivement aux points 8,10,12,14,18,24,36 dans un logiciel de traitement de texte.
<FONT size="1">tout petit</FONT> tout petit
<FONT size="7">tout grand</FONT> tout grand
<FONT size="3">taille de bases des caractères</FONT> taille de bases des caractères
On peut aussi modifier la taille en ajoutant ou soustrayant à la taille de base de la page, qui ici (souvent) est donc de 3. Exemple :
<FONT size="+1">on est en +1</FONT> on est en +1
<FONT size="4">on est en 4</FONT> on est en 4, c’est de la même taille qu’en +1
La couleur peut être définie par son code couleur, ou par son nom usuel s’il existe. Atention, tous les codes de ces listes ne sont probablement pas reconnus
<FONT color="#ff0000">Texte en rouge par le code basique du rouge</FONT>
Texte en rouge par le code basique du rouge
<FONT color="red">Texte en rouge par le nom "red"</FONT>
Texte en rouge par le nom "red"
<FONT color="#00ff00">Texte en vert par son code basique</FONT>
Texte en vert par son code basique
<FONT color="green">Texte en vert par le nom "green"</FONT>
Texte en vert par le nom "green"
<FONT color="lime">Texte en lime</FONT>
Texte en lime
<FONT color="#008000">Texte avec le code associé à "green"</FONT>
Texte avec le code associé à "green"
<FONT color="forestgreen">Texte en forestgreen</FONT>
Texte en forestgreen
<FONT color="#0000ff">Texte en bleu</FONT>
Texte en bleu
<FONT color="blue">Texte en bleu</FONT>
Texte en bleu
<FONT color="#5a98f7">couleur quelconque</FONT>
couleur quelconque
Évidemment il s’agit ici de rester lisible et de ne pas abuser des couleurs ni des grandes tailles de police.
Liens
Il est possible de créer facilement un lien vers un autre article du site, et de plusieurs manières. On peut aussi faire des liens vers l’extérieur du site.
[->1424]
Crée automatiquement un lien vers l’article 1424 avec son titre dans le corp de l’article
31 en lutte semaine du 27 juin au 3 juillet
<article1424>
Insére automatiquement un bloc contenant un lien vers l’article avec son logo
<lien1424>
Insérer un lien vers un article du site avec le message « à lire aussi » donne :
[Partage tes luttes!->www.iaata.info]
fait un lien vers un site (marche aussi avec un mail) où le lien hypertexte se trouve intégré au texte mis entre le crochet ouvert et la flèche.
Note de bas de page
ACAB [[All Cops Are Bastards]]affichera
ACAB [2]
La numérotation et le lien vers la note sont générés automatiquement. Il est également possible de faire un rappel vers une note déjà existante et mettant le numéro de la note entre les deux crochets et entre les signes < et >
1312[[<1>]]affiche
1312 [1]
Liste et puces
-# first
-# second
-# thirdProduit une liste numéroté :
- first
- second
- third
On peut également utiliser des puces, et ceci sur plusieurs niveaux :
-* première ligne
-* deuxième ligne
-** une sous liste à puce
-* de retour dans le niveau initial- première ligne
- deuxième ligne
- une sous liste à puce
- de retour dans le niveau initial
Créer un index
Pour réaliser un index il faut insérer une balise à un première endroit (ici un titre) puis une seconde là où l’on souhaite renvoyer le lien. C’est utilise pour créer un index, ou bien pour renvoyer d’une partie à une autre du texte si c’est nécessaire.
[titre du premier paragraphe->#17 ]
[titre du deuxième paragraphe->#18 ]
conduira à ces balises plus loin :
[#17<-] titre du deuxieme paragraphe
[#18<-] titre du deuxieme paragraphetitre du premier paragraphe
titre du deuxième paragraphe
conduira à ces balises plus loin :
titre du deuxieme paragraphe
titre du deuxieme paragraphe
Encadrer un texte
[(Ceci est un texte en encadré)]
C’est utilise pour mettre en valeur une partie d’un article comme un lieu de rendez-vous et une date, ou bien pour apporter des précisions sur un passage.
Insertion de document (image, PDF,etc)
Il faut tout d’abord téléverser le document depus votre ordinateur ou internet, puis l’intégrer au texte en utilisant écrivant dans le texte de l’article le code correspondant à son fichier.
<img1|left> affiche l’image 1 sur la page a gauche
<img2|center> affiche l’image 2 sur la page au centre
<img3|right> ... ...à droite...
<doc1|left> affiche l’image 1 avec son titre sur la page a gauche
<doc2|center> affiche l’image 2 avec son titre sur la page au centre
<doc3|right> ...à droite...
Et ainsi de suite...
Il est possible de rajouter facilement une légende à votre image ou tout document. Pour cela cliquer sous modifier après avoir téléverser votre fichier, puis rentrez un titre.
Insérer une vidéo, un tweet
C’est le même fonctionnement que pour les documents
<emb4359|center> permet d’insérer insère directement le lecteur
<doc4359|center> insère uniquement une vignette
Il est possible d’intégrer une vidéo depuis un autre site, sans avoir à la téléverser sur le site. Il suffit d’insérer deux espaces avant le lien de la vidéo
https://www.youtube.com/watch?v=GI99SCYbzso
Même fonctionnement pour un tweet, il faut mettre deux espaces avant le lien
https://twitter.com/iaata_info/status/1176788072618287105
Intégrer de l’audio
Il faut téléverser l’audio depuis votre ordinateur sur le site, puis intégrer le code dans le corps du texte.
pour insérer une vignette
<doc2|center>
Ou bien pour pour insérer un lecteur
<emb2|center>
comme pour les documents et les vidéos, left|right|center permet de choisir où sera placé l’objet intégré.
Citation
<quote> je place une citation que je veux mettre en avant ici </quote>je place une citation que je veux mettre en avant ici
Exergue
<exergue|texte=Le texte à mettre en exergue |position=left|right|center> choisir left ou right ou center selon où l’on veut positionner l’exergue
<exergue|texte=exergue centré|position=center>
exergue centré
Format « poésie »
Autre manière de mettre un avant un bout de texte.
<poesie>
Au vent qui sème la tempête
Se récoltent les jours de fête.
</poesie>Au vent qui sème la tempêteSe récoltent les jours de fête.
Attention à l’usage de cette balise, sympathique mais capricieuse qui boulverse souvent le reste de la mise en page.
Forcer des sauts de lignes
De base il n’est pas possible de sauter plus d’une ligne entre deux paragraphes. Mais on peut convenir que parfois pour des raisons de lisibilités il serait pratique de pouvoir en sauter plus.
C’est ce que permet la balise </br>
Chaque intégration de la balise force deux sauts de lignes.
...Fin d'un paragraphe
</br>
...Début du suivant...Fin d’un paragraphe
..Début du suivant
Les différents niveau de titre
SPIP gère plusieurs niveau de titre. Chacun possède une balise différentes.
{{{Exemples de titraille : Titre principal}}}
Exemples de titraille : Titre principal
{{{**Titre niveau deux}}}
Titre niveau deux
{{{***Titre niveau trois}}}
Titre niveau trois
{{{****Titre niveau quatre}}}
Titre niveau quatre
Centrer du texte, écrire à gauche ou à droite
Il est possible de forcer l’alignement du texte d’un côté ou au centre. Pour cela on utilise les balises suivantes :
<center>j'écris au centre</center>
Autre alternative pour aligner du texte à droite ou au centre
[|au centre|]
[/à droite/]
Évidement rien ne sert de chercher à aligner le texte à gauche puisque c’est le comportement pas défaut sur le site.
complements article
Proposer un complément d'info