Parce que depuis 10 ans, mon workflow n’a pratiquement pas changé, je rédige toujours mes articles en Markdown avant de convertir en HMTL à l’import dans WordPress. Cela présente 2 avantages majeurs:

• Le texte reste lisible et l’écriture plus fluide, sans distraction.
• J’évite toujours d’écrire dans une console en ligne (notamment celle de WordPress), exposée à une perte de connexion innopinée et donc de données.

Par ailleurs, le support du Markdown est devenu particulièrement commun dans de très nombreux éditeurs et autres services en ligne, l’un des derniers en date étant Discord qui a annoncé il y a quelques semaines que son chat intégrait désormais le Markdown.

Sauf que je suis un peu rouillé depuis le temps, alors j’ai commencé à me rédiger un petit mémo pratique des balises Markdown et tant qu’à faire, autant le partager ici, si ça peut profiter à d’autres.

Juste pour situer les choses, qui de mieux que son concepteur – John Gruber – pour expliquer ce qu’est le Markdown:

Markdown is a text-to-HTML conversion tool for web writers. Markdown allows you to write using an easy-to-read, easy-to-write plain text format, then convert it to structurally valid XHTML (or HTML).
…
The overriding design goal for Markdown’s formatting syntax is to make it as readable as possible. The idea is that a Markdown-formatted document should be publishable as-is, as plain text, without looking like it’s been marked up with tags or formatting instructions.

Liste non-exhaustive des principales balises Markdown et du résultat obtenu :

Syntaxe Markdown	Résultat
# Titre H1	Titre H1
## Titre H2	Titre H2
### Titre H3	Titre H3
#### Titre H4	Titre H4
##### Titre H5	Titre H5
###### Titre H6	Titre H6
**Texte en gras**	Texte en gras
*Texte en italique*	Texte en italique
~~Texte barré~~	Texte barré
Le mot `texte` est affiché en code sur la même ligne	Le mot texte est affiché en code sur la même ligne
Code multilignes: ``` { “firstName”: “John”, “lastName”: “Smith”, } ```	{ “firstName”: “John”, “lastName”: “Smith”, }
Liste ordonnée: 1. Item A 2. Item B 3. Item C	Item A Item B Item C
Liste non-ordonnée: - Item A - Item B - Item C	Item A Item B Item C
[Ceci est un lien](https://faaabulous.fr)	Ceci est un lien
Ceci est un texte avec une note de bas de page en référence. [^1] [^1]: Ceci est la note de bas de page.	Ceci est un texte avec une note de bas de page en référence. [1]
Indice: H~2~O	H2O
Exposant: X^2^	X2
L’ancre est ici {#ancre–1}	L’ancre est ici {#ancre–1} Lien vers l’ancre
Liste de définitions: term : definition	term definition
Mettre en évidence ces ==trois mots importants==.	Mettre en évidence ces trois mots importants
| Entête Col 1 | Entête Col 2 | | ———– | ———– | | Cellule A1 | Cellule A2 | | Cellule B1 | Cellule B2 |	Entête Col 1 Entête Col 2 Cellule A1 Cellule A2 Cellule B1 Cellule B2

Pour quelques éléments, plus difficiles à visualiser dans un tableau, je les détaille ci-dessous.

• Ligne de séparation: ---

• > Ce texte est une citation

Ce texte est une citation

Et parce que, comme vous le voyez ci-dessus, faire un tableau en Markdown est particulièrement fastidieux, un petit outil bien pratique, Tables Generator, génère automatiquement le code du tableau souhaité.

NB: Le Markdown a pour particularité d’avoir plusieurs évolutions ou variantes supportées2 en fonction des éditeurs de texte. Certaines balises ne fonctionnent pas toujours. Pour donner un exemple, j’utilise Byword et le code pour barrer du texte n’est pas pris en charge. Pas grave en soit, il est toujours possible occasionnellement d’utiliser le code HTML en lieu et place (<del>texte barré</del>) dans mon texte en Markdown.