Markdown, la syntaxe de mise en forme discrète

Qu’est ce que Markdown ?

Markdown est un type de balisage qui permet de mettre en forme un fichier texte (readme par exemple) sans perturber une personne qui va lire le fichier en brut.

Où est utilisé ce type de fichier ?

La plateforme GitHub par exemple utilise ce type de fichier pour décrire un projet. Il est donc utile de connaitre les quelques balises qui vous permettront de mettre en forme le texte.

L’extension de ces fichiers est : .md

Pour tester les différentes balises, j’utiliserai ce notepad qui permet de voir le rendu en temps réel :  http://notepag.es

notepages

1.1 Les titres

La taille des titres se définit avec le nombre de dièses (#) placés avant et après le titre :

# Taille H1 #
## Taille H2 ##
###### Taille H6 ######

Ce qui donne, une fois traduit :

titres_markdown_

2 Les blocs de retrait

C’est l’équivalent de la balise <blockquote> en HTML :

> Le premier degré de retrait
>
> > Second degré.
>
> Autre ligne.

blockquote_markdown

3 Liste d’éléments

Vous pouvez utiliser le caractère “*“, “” ou “+“, l’effet est le même :

* Elément 1
* Elément 2
* Elément 3

ou

+ Elément 1
+ Elément 2
+ Elément 3

ou

– Elément 1
– Elément 2
– Elément 3

liste_markdown

4 Lignes horizontales

Il existe différentes manières de faire une ligne horizontale (</hr> en HTML) :

* * *

***

*****

– – –

—————————————

Peu importe la syntaxe utilisée, le résultat est le même :

ligne_horizontale_markdown

5 Code

Pour partager et mettre en forme du code source informatique, il suffit simplement de mettre  le texte concerné entre des backtick (`) .

Le texte :

Voilà une balise HTML qui permet de mettre le texte en gras `<b>`

donne :

balise_code_markdown

6 Liens

Pour activer l’hyperlink sur un mot, il suffit de le placer entre “<” et “>” :

<http://blog.joeybronner.fr/>

<contact@nicetocodeyou.com>

hyperlink_markdown

7 Images

L’ajout d’une image, avec les paramètres habituels qui sont le texte de remplacement, l’URL de l’image et le titre optionnel :

![Logo Twitter](https://g.twimg.com/Twitter_logo_blue.png)

 

twotter_logo

8 Mettre en évidence du texte

Pour mettre du texte en évidence (gras, barré, italique, etc…) on utilise la syntaxe suivante :

Texte barré : ~~barré~~
Texte italique : *en italique*
Texte gras : **en gras**
Citation : > Ceci est une citation

mise_en_forme_markdown

 

markdown_logo_large

http://fr.wikipedia.org/wiki/Markdown