Licence CC BY-NC-SA

Rédiger sur ZdS

Utilisation du Markdown dans les tutos, articles, forums, etc.

Dernière mise à jour :
Auteur :
Catégorie :
Temps de lecture estimé : 32 minutes

Zeste de Savoir utilise un langage de formatage de texte très proche du Markdown, auquel ont été ajoutées quelques extensions courantes. Ce langage est utilisé sur ZdS pour écrire les tutoriels, les articles, les messages de forums ou MP, etc.

On ne présente plus le Markdown, ce langage de formatage alliant la simplicité d’écriture à la facilité de lecture. Sa syntaxe très légère permet en effet de lire du simple texte de façon presque aussi agréable que s’il était réellement mis en forme. Mais aussi pratique que soit le Markdown, il ne permet pas de tout baliser. Les indices et exposants, par exemple, n’ont pas de représentations Markdown. Il existe donc des extensions permettant de compléter le Markdown natif. Certaines de ces extensions, très courantes, ont été reprises sur ZdS, d’autres ont été spécifiquement implémentées pour répondre aux besoins précis de ZdS. Nous vous présentons donc ici les syntaxes utilisables sur ZdS.

Mise en forme de texte classique

Paragraphes

Les paragraphes s’écrivent naturellement, en sautant une ligne :

Ceci est mon premier paragraphe.

Ceci est mon second paragraphe.

Tout comme avec le Markdown standard, on change de paragraphe en sautant une ligne. Un simple retour à la ligne ne suffit donc pas et sera interprété comme un simple espace :

Ceci est mon premier paragraphe.
Ici, je reviens à la ligne, mais cette phrase sera toujours dans le premier paragraphe.

Ceci est mon second paragraphe.

Si vraiment vous tenez à revenir à la ligne sans changer de paragraphe, comme ceci
par exemple, alors il suffit de terminer la première ligne par deux espaces.

De plus, le Markdown standard autorise l’insertion de HTML, mais pour des raisons de sécurité nous avons choisi de ne pas laisser cette possibilité. Si vous écrivez du HTML, celui-ci apparaitra donc tel quel dans votre texte.

Titres

Les titres sont précédés d’un ou plusieurs croisillons suivant le niveau hiérarchique voulu. Ainsi, un titre de premier niveau s’écrit avec un seul croisillon, un titre de deuxième niveau avec deux croisillons, etc.

# Titre de niveau 1

## Titre de niveau 2

### Titre de niveau 3

#### Titre de niveau 4

Quatre niveaux hiérarchiques sont disponibles. J’attire d’ailleurs votre attention sur ce point car il est très important de donner la bonne hiérarchie à vos titres lorsque vous rédigerez vos tutoriels.

Emphases

Les emphases permettent de mettre un morceau de votre texte en valeur. Deux types d’emphases sont disponibles : l’italique et le gras.

Pour mettre du texte en italique, utilisez l’astérisque ou le souligné (underscore) :

Le mot *italique* est en italique.

ou

Le mot _italique_ est en italique.

Si la syntaxe avec underscore est utilisée en milieu de mot, alors le texte ne sera pas transformé. Ainsi, truc_bidule_mush ne sera pas transformé alors que truc*bidule*mush le sera. Cela tient du fait que les expressions avec des underscores sont communes en informatique comme Mon_super_nom_de_fichier.txt par exemple.

Pour mettre du texte en gras, le principe est le même, en doublant le symbole :

Le mot **gras** est en gras.

ou

Le mot __gras__ est en gras.

Par souci de simplicité et de lisibilité, vous ne pourrez pas mettre du texte en couleur, le souligner, changer sa taille ou bien encore en changer la police.

Barrer

Barrer du texte (comme ceci) se fait en utilisant deux tildes successifs avant et après la portion de texte concernée :

Le mot ~~barré~~ est barré.

Pour information, il s’agit de la syntaxe utilisée par Pandoc.

Alignement du texte

Par défaut, le texte est bien évidemment aligné à gauche. Comme nous le verrons plus loin, certains éléments sont centrés automatiquement, comme les images seules dans leur paragraphe par exemple. Vous n’avez donc en général pas à vous soucier de l’alignement du texte : le site s’en charge pour vous.

Dans les rares cas où vous souhaiteriez centrer volontairement un texte (si l’envie vous prenait d’écrire un poème par exemple), vous pourriez néanmoins utiliser la syntaxe ci-dessous :

-> Ce texte est centré. <- 

Le texte est simplement entouré de deux petites flèches (tiret et chevron) de directions inversées. Pour aligner à droite, on utilise deux flèches dirigées vers la droite :

-> Ce texte est aligné à droite. -> 

Il est impossible d’imbriquer des alignements. Cela n’aurait de toute façon pas de sens (comment aligner à droite un texte centré ?).

Encore une fois, l’alignement est géré automatiquement dans la majorité des cas. N’en abusez pas, cela pourrait gêner la lecture.

Enfin, sachez qu’il est impossible de justifier du texte sur le site.

Indices et exposants

Là encore, ce sont les syntaxes de Pandoc qui sont utilisées pour mettre en indice ou en exposant une portion de texte.

On utilise l’accent circonflexe pour l’exposant. Si par exemple on veut écrire que 210 vaut 1024, alors on écrira :

2^10^ vaut 1024.

Pour l’indice, comme dans H2O par exemple, on utilise cette fois le tilde :

La molécule de l'eau est H~2~O.

Listes

Vous pouvez utiliser deux types de liste :

  • les listes non ordonnées (comme la présente) ;
  • les listes ordonnées par chiffres arabes.

C’est peut-être la syntaxe la plus intuitive du Markdown ! Il suffit de matérialiser les puces par des tirets :

- Ma très belle ;
- liste ;
- à puces.

Ou bien par des chiffres :

1. Mon premier.
2. Mon second.
3. Mon troisième.

Prenez simplement garde à bien sauter une ligne avant et après vos listes.

Pour faire une sous-liste, indentez les puces imbriquées avec quatre espaces :

- Ma très belle ;
- liste ;
    - avec une sous-liste ;
- à puces.

On obtient ainsi :

  • Ma très belle ;
  • liste ;

    • avec une sous-liste ;
  • à puces.

Liens et emails

Il existe deux façons d’écrire des liens : avec ou sans texte d’ancrage.

Liens et emails avec texte d’ancrage

Pour faire un lien sur un morceau de texte (qu’on appelle donc texte d’ancrage, ici le mot "lien"), on utilise la syntaxe suivante :

Pour faire un [lien](http://www.zestedesavoir.com "Zeste de Savoir") sur un morceau de texte

Attention à ne pas mettre d’espace entre la partie concernant le texte d’ancrage (entre crochets) et la partie concernant l’URL (entre parenthèses).

Le titre du lien (ici "Zeste de Savoir" entre guillemets) est optionnel. S’il est renseigné, il apparaît sur le lien au passage de la souris.

Les emails peuvent s’écrire de la même façon que les liens. Pensez simplement à ajouter la mention "mailto:" :

Pour nous contacter, cliquez [ici](mailto:contact@monsite.com).

Liens présentés sous forme d’URL ou d’email

Si vous ne souhaitez pas utiliser de texte d’ancrage et ainsi rendre une URL ou un email cliquable, alors vous n’avez rien à faire : URL et emails seront automatiquement cliquables.

Pour les emails, vous n’avez donc même pas besoin de vous soucier du "mailto".

Tableaux et lignes

Des tableaux simples

Pour faire un tableau, la façon la plus simple est encore de le dessiner, à l’aide de barres verticales et de tirets :

Nom     |   Age
------|-----
Fred |   39
Sam |   38
Alice  |   35
Mathilde  | 35

L’exemple ci-dessus donnera donc :

Nom Age
Fred 39
Sam 38
Alice 35
Mathilde 35

Cette syntaxe est simple mais elle a ses limites : il est impossible de revenir à la ligne dans une cellule ou bien de fusionner des lignes ou des colonnes. Si vous avez vraiment besoin de faire cela, il vous faudra utiliser une autre syntaxe de tableau, plus lourde mais plus complète, comme nous allons le voir à présent.

Tableaux complexes

Pour des tableaux plus complexes, dans lesquels vous pourrez notamment revenir à la ligne dans une cellule et fusionner des lignes ou colonnes, il vous faut utiliser la syntaxe dite « grid-table » :

+-------+----------+------+
| Table Headings   | Here |
+-------+----------+------+
| Sub   | Headings | Too  |
+=======+==========+======+
| cell  | column spanning |
+ spans +----------+------+
| rows  | normal   | cell |
+-------+----------+------+
| multi | cells can be    |
| line  | *formatted*     |
|       | **paragraphs**  |
| cells |                 |
| too   |                 |
+-------+-----------------+

Ce qui vous donnera :

Table Headings

Here

Sub

Headings

Too

cell spans rows

column spanning

normal

cell

multi line

cells too

cells can be formatted paragraphs

Légendes de tableaux

Quelle que soit la syntaxe utilisée, vous pouvez indiquer une légende à votre tableau en ajoutant une ligne Table: Ma légende juste en dessous du tableau.

Le mot « Table » est optionnel, pas les deux-points. Il peut y avoir un espace entre « Table » et les deux-points.

Nom     |   Age
------|-----
Fred |   39
Sam |   38
Alice  |   35
Mathilde  | 35
Table: Tableau des âges
Nom Age
Fred 39
Sam 38
Alice 35
Mathilde 35
Tableau des âges

Lignes horizontales

Pour tracer une ligne horizontale, le principe est le même : dessinez-là. La syntaxe est cette fois bien plus simple puisqu’elle n’est constituée que de trois tirets (ou plus, ça ne change rien au résultat) :

------

Voici le résultat :


Formules mathématiques

Une formule mathématique s’écrit à l’aide d’expressions TeX Math, en l’entourant de deux caractères dollars $$ :

$$a \cdot x^2 + b \cdot x + c = 0 \quad \Longrightarrow \quad x = \frac {-b \pm \sqrt{b^2 - 4ac}}{2a}$$

Ce qui donne :

ax2+bx+c=0x=b±b24ac2aa \cdot x^2 + b \cdot x + c = 0 \quad \Longrightarrow \quad x = \frac {-b \pm \sqrt{b^2 - 4ac}}{2a}ax2+bx+c=0x=2ab±b24ac

En faisant ainsi, votre formule est en mode displayed : elle est dans son propre paragrpahe et s’affiche en prenant ses aises. Ainsi les chiffres et autres symboles sont écrits en grande taille et sont facilement lisibles.

Si vous voulez écrire votre formule au sein même d’un paragraphe (comme ceci : ax2+bx+c=0a \cdot x^2 + b \cdot x + c = 0ax2+bx+c=0), alors n’utilisez cette fois qu’un seul caractère dollar $ avant et après votre formule. Par exemple :

Si vous voulez écrire votre formule au sein même d'un paragraphe (comme ceci : $a \cdot x^2 + b \cdot x + c = 0$),
 alors n'utilisez cette fois qu'un seul caractère dollar $ avant et après votre formule.

Comme pour les tableaux, vous pouvez mettre une légende à votre formule, en ajoutant une ligne Equation: Ma légende juste en dessous.

Si vous souhaitez écrire deux symboles $ dans une même ligne, alors il vous faut échapper au moins l’un des deux (c’est-à-dire les faire précéder d’un antislash : \$) afin que le texte ne soit pas considéré comme une formule mathématique.

Pour en savoir plus sur l’utilisation des expressions mathématiques, vous pouvez consulter le tutoriel dédié: Comment rédiger des maths sur Zeste de Savoir ?

Code

Bloc de code

Il n’est pas rare d’illustrer son propos d’un petit exemple de code :

#!/usr/bin/env python3

print("Hello, World!")
Mon exemple de code

Pour cela, il existe plusieurs solutions.

Première solution : entourer votre code d’au moins trois accents graves ` (Alt Gr + 7), avant et après :

```
#!/usr/bin/env python3

print("Hello, World!")
```

Le langage utilisé sera détecté automatiquement et donc coloré en conséquence. Si tel n’est pas le cas, vous pouvez forcer le langage en l’indiquant à la suite des caractères ouvrants :

```python
#!/usr/bin/env python3

print("Hello, World!")
```

La liste des langages supportés est celle de pygment, vous la trouverez ici. Les mots-clés à insérer pour déclencher la coloration sont les « short names » disponibles sur cette page.

Seconde solution, faites précéder chaque ligne de quatre espaces ou bien d’une tabulation :

    #!/usr/bin/env python3
    
    print("Hello, World!")

Pour forcer le langage, utilisez cette fois trois symboles de deux-points de suite :

    :::python
    #!/usr/bin/env python3
    
    print("Hello, World!")

Là encore, vous pouvez mettre une légende à votre bloc de code en ajoutant, juste en dessous du bloc, une ligne Code: Votre légende.

Mise en évidence de lignes de code

Mettre en évidence une portion de code permet d’appuyer votre explication :

use strict;
use warnings;

print "Comment vous appelez-vous ? ";
my $nom = <>; # Récupération du nom de l'utilisateur
chomp $nom;   # Retrait du saut de ligne
print "Bonjour, $nom !\n";

Après le nom du langage, indiquez simplement les lignes à surligner avec la mention hl_lines. Vous pouvez surligner les lignes unes à unes ou par groupes. Le syntaxe est la suivante :

```perl hl_lines="1 4-6"
use strict;
use warnings;

print "Comment vous appelez-vous ? ";
my $nom = <>; # Récupération du nom de l'utilisateur
chomp $nom;   # Retrait du saut de ligne
print "Bonjour, $nom !\n";
```
Bug connu

Dans les dernières versions de zds la mise en avant des lignes ne fonctionne que dans le cadre des PDF. Nous cherchons toujours une solution à ce problème.

Début de la numérotation

Il est possible de spécifier le début de numération. Par exemple :

def test(truc):      # Cette ligne est en évidence et est numérotée 10
    print truc         # Cette ligne est numéroté 11
                         # Cette ligne est numéroté 12
test("coucou")     # Cette ligne est en évidence et est numérotée 13

On utilise le mot-clé linenostart de la même façon que le hl_lines vu précédemment.

Code inline

Enfin, si vous souhaitez insérer un petit élément de code dans votre phrase (comme print par exemple), alors un seul accent grave autour du mot suffira :

comme `print` par exemple

Médias

Images

L’insertion d’une image ressemble à celle d’un lien, à ceci près que le texte d’ancrage doit être remplacé par un texte alternatif :

![Logo Creative Commons](http://mirrors.creativecommons.org/presskit/logos/cc.logo.png)

Il y a une petite différence de comportement selon que vous placiez votre image seule dans un paragraphe (ou dans un bloc de texte type citation, information, secret, etc.) ou bien au cours d’une phrase dans votre texte.

Lorsque l’image est seule, alors elle est présentée comme figure avec légende. Ainsi, si on prend l’exemple suivant :

Bla bla bla

![Logo Creative Commons](http://mirrors.creativecommons.org/presskit/logos/cc.logo.png)

Bla bla bla encore

Alors le rendu sera la suivant :


Bla bla bla

Logo Creative Commons
Logo Creative Commons

Bla bla bla encore


Si en revanche l’image est placée au cours d’un texte, alors le comportement sera plus classique et l’image apparaîtra naturellement dans la phrase :

Appuyez sur l'icône ![Icône machintruc](icone.png) et admirez le résultat.

Dans tous les cas, le texte alternatif doit être renseigné. Il sert à apporter la même information que l’image si celle-ci ne peut être chargée ou bien ne peut être vue (notamment pour les synthétiseurs vocaux pour les non-voyants).

Il est possible de définir à la fois un texte alternatif et une légende, en utilisant le mot-clé Figure de la même façon que pour les légendes de tableaux ou blocs de code :

Bla bla bla

![Mon super alt](logo.png)
Figure: Ma super légende !

Bla bla bla

Ainsi, le texte alternatif et la légende sont bien différents.

Vidéos

Les vidéos doivent être insérées avec une syntaxe dédié : !(URL Vidéo). Elles ne peuvent être inline (au sein d’une phrase).

Pour insérer une vidéo on peut donc faire :

Bla bla bla

!(http://www.youtube.com/watch?v=oavMtUWDBTM)

Bla bla bla

ou avec une légende :

Bla bla bla

!(http://www.youtube.com/watch?v=oavMtUWDBTM)
Video: Ma super légende

Bla bla bla

Par exemple :

Ma super légende

Touches

Pour représenter une touche, utilisez deux barres verticales avant et après le nom de la touche :

Utilisez ||Ctrl|| + ||C|| pour copier.

Vous pouvez bien sûr mettre ce que vous voulez comme nom de touche.

Smileys

Que serait un forum sans smileys ? Un forum plus agréable ? Peut-être. Il n’empêche que les fameux smileys sont incontournables. Sur ZdS, les smileys que vous écrivez seront automatiquement transformés en image. Ci-dessous une liste (non exhaustive) des smileys disponibles :

Entrée Résultat
:) :)
:D :D
;) ;)
:p :p
:lol: :lol:
:euh: :euh:
:( :(
:o :o
:colere2: :colere2:
o_O o_O
^^ ^^
:-° :-°
:ange: :ange:
:colere: :colere:
:diable: :diable:
:magicien: :magicien:
:ninja: :ninja:
>_< >_<
:pirate: :pirate:
:'( :'(
:honte: :honte:
:soleil: :soleil:
:waw: :waw:
:zorro: :zorro:
Liste non exhaustive des smileys

N’oubliez pas : l’abus de smileys est dangereux pour votre santé et celle de vos proches, utilisez-les avec modération. ;)

Blocs spéciaux

Balises attention, erreur, information, question et secret

Les tutoriels et articles de ZdS sont parsemés de balises telles que la balise "information" :

Ceci est une balise d’information.

Cool, non ?

Elle se fait avec la syntaxe suivante :

[[information]]
| Ceci est une balise d'information.
|
| Cool, non ?

Ou dans sa version raccourcie :

[[i]]
| Ceci est une balise d'information.
|
| Cool, non ?

Les balises disponibles sont :

  • attention
  • erreur
  • information
  • question
  • secret

La balise "secret" (appelée "spoiler" sur certains sites) a ceci de spécial qu’elle masque son contenu par défaut et ne le rend visible qu’au clic de l’utilisateur.

Citations

Les citations permettent de séparer votre propos de celui que vous rapportez. D’ailleurs, si l’on en croit ce vieux proverbe nous venant d’une petite planète quelque part aux confins de Bételgeuse, il ne faut pas s’en priver :

Les citations, c’est bien.

Petite planète quelque part aux confins de Bételgeuse

On utilise pour cela un chevron devant chaque début de ligne, avec optionnellement votre source, écrite de la même façon que les légendes (avec le mot-clé Source) :

> Ceci est une citation
> sur plusieurs lignes
Source: Citez vos sources !

Blocs à titre et blocs neutres

Parfois vous désirez mettre en avant une information (par exemple un théorème) mais aucun des blocs spéciaux ne vous convient. Vous pouvez alors utiliser un bloc neutre.

Ce bloc aura forcément un titre, ce qui aidera à mettre le contenu en avant. Par exemple :

[[neutre | Théorème de Pythagore]]
| Un triangle ABC est rectangle en a si et seulement si $AB^2 + AC^2 = BC^2$
Théorème de Pythagore

Un triangle ABC est rectangle en a si et seulement si AB2+AC2=BC2AB^2 + AC^2 = BC^2AB2+AC2=BC2

Notons que tous les autres blocs peuvent aussi avoir un titre, il se présente de la même manière, c’est-à-dire en mettant [[nom_du_bloc | titre du bloc]]. Ils ne sont par contre pas obligatoires.

Notes et abréviations

Abréviations

Il est souvent utile de préciser la signification d’une abréviation (notamment d’un acronyme ou d’un sigle), sans toutefois la faire figurer dans le corps du texte. En utilisant la syntaxe suivante, la signification apparaîtra au passage de la souris sur l’abréviation :

Bienvenue sur ZdS !

*[ZdS]: Zeste de Savoir

Bienvenue, donc, sur ZdS !

Notes de bas de page

Toujours dans l’idée d’enrichir votre texte1, vous pouvez utiliser des notes de base de page :

Markdown[^mdown] est une syntaxe légère d'écriture de documents. Pandoc[^pandoc] est un convertisseur de documents.

[^mdown]: Plus d'informations sur [Markdown](http://daringfireball.net/projects/markdown/).

[^pandoc]: Plus d'informations sur [Pandoc](http://johnmacfarlane.net/pandoc/).

Les notes sont alors numérotées automatiquement. Vous n’avez à vous soucier que du nom que vous donner à votre note.


  1. Sans pour autant l’alourdir.

Caractères réservés et commentaires

Si vous avez besoin d’écrire un caractère réservé entrant en conflit avec l’une des syntaxes décrites ici (l’astérisque par exemple), vous pouvez le faire en le précédent d’un antislash : \*

Enfin, vous pouvez mettre une partie de votre texte en commentaires en le mettant entre des balises spécifiques :

Ceci est mon texte. <--COMMENTS Et ceci est une partie commentée. COMMENTS--> 

La partie commentée n’apparaîtra tout simplement pas dans le rendu final.

La typographie

Afin de vous aider à rédiger un contenu agréable à lire, le moteur markdown de zeste de savoir inclus un module de typographie automatique.

Cela signifie que certains caractères (par exemples les apostrophes anglais) seront remplacés par des caractères typographiquement corrects.

De même, nous nous occupons de mettre les espaces insécables aux bons endroits.

Espace quoi?

Lorsque vous écrivez une phrase longue, votre navigateur va automatiquement passer à la ligne une fois la limite atteinte. Pour faire cela, il va "couper" la phrase. Le meilleur endroit pour couper une phrase, c’est l’espace entre deux mots.

Mais voilà, il existe certaines règles de typographie qui rendent ce comportement gênant. Par exemple, lorsque vous vous préparez à faire une liste et que vous terminez votre phrase par :.

Logiquement, vous devez entourer votre caractère : d’espaces. Ce qui peut amener un cas étrange : votre phrase étant trop longue, votre navigateur met les : à la ligne.

C’est ce problème que résout l’espace insécable. Son nom elle ne l’usurpe pas : c’est une espace qui ne peut pas être coupée. En fait l’espace qui est avant les : doit être une espace insécable.

Le problème c’est que la majorité des claviers et des systèmes d’exploitation n’ont pas de moyen simple de faire cette espace. Et c’est pourquoi nous la faisons pour vous. En plus ça vous évitera de vous demander quels types et combien d’espaces vous devez mettre autour d’un signe de ponctuation.

Aide mémoire :

Caractère Remplacement
%0
<< «
>> »
--mot-- – mot –
---mot--- — mot —
...
.:;!?() les espaces sécables ou non sont correctement placées autour des signes
Tableau des remplacements

N’hésitez pas à commenter ce tuto pour remonter toute erreur ou imprécision. Merci !

102 commentaires

Reprise du dernier message de la page précédente

J'ai commencé a faire des remplacement que récemment sur une demande de SpaceFox qui concernait les cadrin. On peut imaginer pas mal de chose. Pour le moment il y a quelques bugs a corriger. Donc pourquoi pas des que j'ai le temps

Édit : le fait que ça a été ajouté récemment explique pourquoi ce n'est pas mentionné : l'article était déjà écrit et j'ai oublié de prévenir shig pour cela

Édité

+1 -0

Salut,

Je viens de faire les ajouts suivants :

  • phrase pour dire que pour revenir à la ligne sans changer de paragraphe il faut mettre deux espaces ;
  • impossible de changer la taille du texte ;
  • ajout de la distinction $ et $$ pour les formules mathématiques ;
  • mise en place des nombreuses corrections proposées par Itello (merci spécial à lui !) ;
  • ajout de l'explication pour les sous-listes.

Merci à vous pour ces retours. J'espère ne pas avoir oublié trop de trucs.

Kje, à l'occasion, si tu as ajouté des fonctionnalité n'hésite pas à me le dire (j'avoue ne pas avoir tout suivi sur le dépôt :-° ).

Édité

Suivez ZdS sur Twitter ! Et venez aux JZDS Lille !

+2 -0

Bonne surcouche, les améliorations sont agréables à utiliser et restent dans l'esprit du Markdown original. Dommage cependant que le HTML ne soit pas supporté (je pense notamment aux flottants qui peuvent donner un rendu sympathique quand utilisés avec des images), mais je suppose qu'il sera toujours possible d'enrichir le Markdown pour y pallier.

J'ai noté une coquille dans la partie Formules mathématiques, il est écrit "paragrpahe" au lieu de "paragraphe" sous le premier exemple donné.

+0 -0

@shiherum : on est en freeze aussi pour le MD, normalement pas d'ajouts mais peut être des trucs jamais documentés.

@Thiht : en fait le non support du HTML est un choix, pour 3 raisons principalement :

  • sécurité : on ne peut pas tout autoriser du HTML ai risque d'avoir des problèmes. Bloquer le HTML résout de façon efficace ce problème même si un peu "au bulldozer" je te l'accorde.
  • noob : il va y avoir des débutants qui vont venir normalement poser des questions sur le forum a propos du HTML et qui vont surrement ne pas utiliser le balisage de code (inline ou non) pour ces tags. On limite ainsi les dégâts pour les personnes qui risque d'avoir le plus de difficultés.
  • multi-support : pour tuto et article, on doit convertir le contenu en ebook et pdf. Et la le HTML va poser problème (surtout pour le pdf qui passe par pandoc et latex).

La philosophie a surtout été de mettre des balises sémantique en ce sens que tu n'est pas censé gérer le style mais juste le contenu.

Par contr on peut envisager rajouter une balise pour les flottant mais il y avait de l'opposition dans l'équipe a ce propos

+0 -0

Merci pour cet article !

Simplement, pour le linenostart, ça ne fonctionne chez moi que si on ne met pas de guillemets après le égal :

1
```python linenostart=7

"Bienheureux celui qui sait rire de lui-même, il n’a pas fini de s’amuser." Joseph Folliet

+0 -0

Je me demandais s'il serait pertinent de préciser qu'on peut mélanger quelques langages dans les blocs de code ?

Par exemple, pour présenter le code d'un template, on peut mettre html+php (ou html+django pour Django/Jinja/Twig, ou encore html+smarty), qui permet d'avoir les deux colorations syntaxiques.

1
2
3
4
5
6
7
{% for bar in foo %}
  <a href="{{ bar.zig }}">{{ bar.zag }}</a>
  <a href="{{ bar.zig2 }}">{{ bar.zag2 }}</a>
  <a href="{{ bar.zig3 }}">{{ bar.zag3 }}</a>
{% else %}
  There were no rows found.
{% endforeach %}

HTML & Twig, juste le HTML coloré

1
2
3
4
5
6
7
{% for bar in foo %}
  <a href="{{ bar.zig }}">{{ bar.zag }}</a>
  <a href="{{ bar.zig2 }}">{{ bar.zag2 }}</a>
  <a href="{{ bar.zig3 }}">{{ bar.zag3 }}</a>
{% else %}
  There were no rows found.
{% endforeach %}

HTML & Twig, juste le Twig coloré (Django)

1
2
3
4
5
6
7
{% for bar in foo %}
  <a href="{{ bar.zig }}">{{ bar.zag }}</a>
  <a href="{{ bar.zig2 }}">{{ bar.zag2 }}</a>
  <a href="{{ bar.zig3 }}">{{ bar.zag3 }}</a>
{% else %}
  There were no rows found.
{% endforeach %}

HTML & Twig, coloré "complètement"

Pendant la bêta privée, on avait même débattu du fait de l'ordre (dans ces exemples, il ne faut pas mettre html à la fin, sans quoi on n'a aucune coloration) et de la particularité de html qui contient nativement javascript.

Evitez qu’on vous dise de les lire : FAQ PHP et SymfonyTutoriel WAMP • Cliquez 👍 pour dire merci • Marquez vos sujets résolus

+0 -0

Pendant la bêta privée, on avait même débattu du fait de l'ordre (dans ces exemples, il ne faut pas mettre html à la fin, sans quoi on n'a aucune coloration) et de la particularité de html qui contient nativement javascript.

C'est le fonctionnement de pygment en fait : il y a un lexer qui s’appelle html+django, mais pas de lexer qui s’appelle django+html.

Mon Github — Tuto Homebrew — Article Julia

+0 -0

très bon tuto, mais y à-t-il un moyen de tester les messages en Markdown (la version modifié présente sur ce site) avant de les poster?
car les sites de preview ne manquent pas (comme celui-ci: markdown live preview ) mais il ne prend pas en compte les fonctions comme les smileys, les blocs spéciaux, et les abréviations. Y à-t-il un moyen de tester les message postés sur zeste de savoir avant de les rendre publique. (peut-être que le site donné plus haut supporte les fonctions énumérées ci-dessus mais que la syntaxe que j'ai mise était fausse.
merci de méguiller

+0 -0

Très très bon tutoriel, bien pratique pour faire de bôôôos messages, mais je me pose une question : comment fait-on pour placer un tiret au début de ligne ? si j'essaie, ça me donne invariablement :

  • Salut poilu(e) !

et je voudrais un rendu du genre : "- Salut poilu(e) !". Mais comment faire ? Zatize ze Kouèchteune (avec un grand "K").

P.S. : Bon je fignole vraiment, en vrai je peux faire :

-Salut poilu(e) !

C'est juste pour vous embêter et vous donner un peu de fil à retordre :p

Quand un éléphant prend la défense d’un autre, est-ce de l’altruisme ou du vol ?

+0 -0
Vous devez être connecté pour pouvoir poster un message.
Connexion

Pas encore inscrit ?

Créez un compte en une minute pour profiter pleinement de toutes les fonctionnalités de Zeste de Savoir. Ici, tout est gratuit et sans publicité.
Créer un compte