Retour au blog

Les blockquotes Markdown expliqués : le guide complet des devis

Le guide complet des blockquotes de démarque. Apprenez la syntaxe, l'imbrication, les alertes GitHub, les légendes Obsidian, le style, la compatibilité des plates-formes et tous les autres cas d'utilisation que vous rencontrerez.

Benjamin McBrayer // Publié: 24 avril 202612 min de lecture

Une citation en bloc est un moyen de mettre en évidence un texte provenant d'une autre source ou nécessitant une accentuation supplémentaire, comme une citation, une note ou un exemple. Dans Markdown, les blockquotes sont faciles à créer avec un simple symbole, ce qui les rend utiles pour les écrivains, les blogueurs, les étudiants et toute personne publiant du contenu en ligne. Ce guide vous montrera ce que sont les blockquotes et comment les utiliser correctement dans Markdown.

Réponse rapide : Comment créer un blockquote dans Markdown ?

Pour créer un blockquote dans markdown, ajoutez un signe supérieur à (>) suivi d'un espace au début de n'importe quelle ligne. The entire line becomes a quoted block.

> This is a blockquote.

Rend comme :

Ceci est une citation.

C'est toute la syntaxe de base. Le reste de ce guide couvre les guillemets multilignes, l'imbrication, les alertes GitHub, les légendes Obsidian, le style, la compatibilité des plates-formes et tous les autres cas d'utilisation que vous rencontrerez. Pour une référence plus large, consultez notre aide-mémoire complète Markdown.


Syntaxe de base des blockquotes dans Markdown

Chaque blockquote de démarque commence par > au début d'une ligne.

> This is a single-line blockquote.

Rend comme :

Il s'agit d'un blockquote d'une seule ligne.

L'espace après > est facultatif mais recommandé. Ces deux éléments fonctionnent de manière identique dans la plupart des analyseurs :

> With a space
>Without a space

Pour une compatibilité maximale, en particulier sur les analyseurs CommonMark plus stricts, incluez toujours l'espace.

Pourquoi le caractère > ? Markdown a emprunté sa syntaxe de citation aux conventions de courrier électronique. Lorsque vous répondez à un e-mail, le texte cité est souvent préfixé par « > ». Gruber a conservé cette convention car elle était déjà familière à tous ceux qui utilisaient le courrier électronique depuis les années 1980.


Citations multilignes dans Markdown

Plusieurs lignes dans le même paragraphe

Ajoutez > au début de chaque ligne :

> This is line one of the blockquote.
> This is line two.
> This is line three.

Rendu sous la forme d'un seul paragraphe :

Ceci est la première ligne du blockquote. C'est la deuxième ligne. C'est la ligne trois.

Suite paresseuse (non recommandée)

Certains analyseurs vous permettent de supprimer le > sur les lignes de suite :

> This is line one.
This is line two (lazy style).

Cela fonctionne dans CommonMark et GitHub Flavored Markdown, mais certains analyseurs s'y opposent. Préfixez toujours chaque ligne avec > pour des raisons de compatibilité.

Citations multi-paragraphes

Pour plusieurs paragraphes à l'intérieur d'un seul blockquote, séparez-les par une ligne contenant uniquement > :

> This is the first paragraph of the blockquote.
>
> This is the second paragraph. Notice the blank `>` line above.
>
> And this is a third paragraph.

Rend comme :

Ceci est le premier paragraphe du blockquote.

Ceci est le deuxième paragraphe. Notez la ligne vide > ci-dessus.

Et ceci est un troisième paragraphe.

Règle critique : La ligne vide entre les paragraphes doit toujours comporter le caractère >. Sans cela, le blockquote se termine et un nouveau commence, ce qui n'est généralement pas ce que vous souhaitez.


Blockquotes de démarques imbriquées

Empilez les caractères > pour imbriquer les guillemets les uns dans les autres :

> This is the first-level quote.
>
> > This is a nested quote inside the first one.
> >
> > > And this is nested three levels deep.
>
> Back to the first level.

Rend comme :

Ceci est la citation de premier niveau.

Il s'agit d'une citation imbriquée à l'intérieur de la première.

Et ceci est imbriqué sur trois niveaux de profondeur.

Retour au premier niveau.

L'imbrication est courante dans les chaînes de réponse de type e-mail, où chaque niveau de « > » représente une autre série de citations. En pratique, aller plus loin que deux ou trois niveaux devient difficile à lire, alors envisagez de restructurer le contenu avant d'imbriquer quatre niveaux de profondeur.


Formatage à l'intérieur des blockquotes Markdown

Les blockquotes peuvent contenir la plupart des autres éléments de démarque. Placez chaque élément sur sa propre ligne, toujours préfixé par >.

Formatage du texte

> You can use **bold**, *italic*, ***bold italic***,
> ~~strikethrough~~, and `inline code` inside blockquotes.

Rend comme :

Vous pouvez utiliser gras, italique, gras italique, strikethrough et code en ligne à l'intérieur des guillemets.

Rubriques

> ### This is a heading inside a blockquote
>
> And this is regular text below it.

Rend comme :

### Ceci est un titre à l'intérieur d'une citation

Et c'est du texte normal en dessous.

Listes

Les listes ordonnées et non ordonnées fonctionnent :

> **Quarterly Review:**
>
> - Revenue grew 23%
> - Headcount increased by 12
> - Customer churn dropped to 3%
>
> *All metrics are trending in the right direction.*

Rend comme :

Revue trimestrielle :

  • Le chiffre d'affaires a augmenté de 23 %
  • Effectif augmenté de 12 personnes
  • Le taux de désabonnement des clients est tombé à 3 %

Tous les indicateurs évoluent dans la bonne direction.

Blocs de code

Les blocs de code clôturés fonctionnent entre guillemets, mais chaque ligne a toujours besoin du préfixe > :

> Run the following command to install:
>
> ```coup
> npm installer markdown-it
>```
>
> Then restart your application.

Liens et images

> For more info, visit [our documentation](https://example.com).
>
> ![Logo](https://example.com/logo.png)

Ce qui ne fonctionne pas de manière fiable

  • Les tables à l'intérieur des blockquotes fonctionnent dans GitHub Flavored Markdown mais échouent dans les analyseurs plus stricts. Testez avant de vous y fier.
  • Les règles horizontales entre guillemets (---) sont ambiguës et s'affichent de manière incohérente.
  • Les éléments de bloc HTML à l'intérieur des guillemets se comportent de manière imprévisible entre les analyseurs.

Alertes GitHub (notes, avertissements, conseils)

GitHub Flavored Markdown (GFM) étend la syntaxe des blockquotes avec cinq types d'alertes spéciales qui s'affichent avec des couleurs et des icônes distinctes sur GitHub, les problèmes GitHub, les README et les demandes d'extraction.

Syntaxe

> [!NOTE]
> Useful information that users should know, even when skimming.

> [!TIP]
> Helpful advice for doing things better or more easily.

> [!IMPORTANT]
> Key information users need to know to achieve their goal.

> [!WARNING]
> Urgent info that needs immediate user attention to avoid problems.

> [!CAUTION]
> Advises about risks or negative outcomes of certain actions.

Règles pour les alertes GitHub

  • Le type d'alerte ([!NOTE], [!TIP], etc.) doit figurer sur sa propre ligne au début du blockquote.
  • Les types d'alertes sont sensibles à la casse, [!note] ne fonctionnera pas.
  • L'alerte s'applique à l'intégralité du blockquote qui suit.
  • Un seul type d'alerte par blockquote. Le mélange de types n’est pas pris en charge.

Quand utiliser chaque type

Alerte Utiliser pour
[!NOTE] Contexte utile qui n'est pas critique mais aide le lecteur
[!CONSEIL] Conseils facultatifs qui rendent quelque chose plus facile ou meilleur
[!IMPORTANT] Informations que le lecteur doit connaître pour réussir
[!AVERTISSEMENT] Quelque chose qui pourrait mal tourner s'il est ignoré
[!ATTENTION] Risques graves, perte de données, problèmes de sécurité, actions irréversibles

Les alertes GitHub fonctionnent dans les README du référentiel, les pages wiki, les problèmes, les demandes d'extraction et les discussions. Ils ne s'affichent pas sous forme d'alertes en dehors de GitHub, ailleurs, ils reviennent aux guillemets normaux avec le texte [!NOTE] visible sous forme de texte brut.


Légendes d'obsidienne

Obsidian utilise une syntaxe similaire aux alertes GitHub mais avec beaucoup plus d'options. La syntaxe est > [!type] suivie du contenu :

> [!note] Custom title here
> This is a note callout with a custom title.

> [!warning]
> This is a warning callout.

> [!tip] Pro tip
> Callouts can have custom titles for extra context.

Types de légendes d'obsidienne

Obsidian prend en charge plus d'une douzaine de types de légendes, chacune avec des couleurs et des icônes distinctes :

  • note, info, résumé, résumé, tldr
  • astuce, indice, important
  • succès, vérifier, terminé
  • question, aide, faq
  • avertissement, prudence, attention
  • échec, échec, manquant
  • danger, erreur
  • 'bug'
  • exemple
  • citer, cite

Légendes pliables

Ajoutez un « + » ou un « - » après le type pour rendre les légendes pliables :

> [!note]+ Click to expand (starts open)
> Content hidden behind a toggle.

> [!warning]- Click to expand (starts closed)
> Collapsed by default.

Légendes imbriquées

Les légendes peuvent être imbriquées comme des guillemets classiques :

> [!note] Outer callout
> This is the outer content.
>
> > [!tip] Inner callout
> > This is nested inside.

Les légendes d'Obsidian sont la raison pour laquelle de nombreux utilisateurs de démarques préfèrent Obsidian pour la prise de notes, elles transforment de simples citations en boîtes d'informations riches et stylisées.


Quand utiliser les blockquotes

Les blockquotes sont polyvalents. Voici les cinq situations les plus courantes dans lesquelles vous les utiliserez, avec des exemples pour vous aider à comprendre.

1. Citer quelqu'un d'autre

Le but initial. Attribuez les citations à leur source avec une ligne d'attribution :

> The best way to predict the future is to invent it.
>
> Alan Kay

Rend comme :

La meilleure façon de prédire l'avenir est de l'inventer.

Alan Kay

Style académique avec citation appropriée :

> 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).
>
> John Gruber, [Daring Fireball](https://daringfireball.net/projects/markdown/)

2. Tirez des citations dans le contenu long

Retirez une phrase mémorable du corps du texte pour attirer l'attention visuelle :

The team shipped the feature in record time. Morale soared. Revenue followed.

> In three months, we went from zero users to forty thousand.

What made the difference wasn't the code, it was the timing.

3. Légendes et notes

Avant que les alertes GitHub n'existent, les utilisateurs utilisaient des citations avec des étiquettes en gras pour créer des légendes :

> **Note:** This feature requires Node.js 18 or higher.

> **Warning:** Running this command will delete all data in the database.

> **Tip:** You can skip the setup step by using the `--auto` flag.

Encore largement utilisé sur les plateformes qui ne prennent pas en charge les alertes GitHub.

4. Réponses et citations par e-mail

Dans les discussions, les problèmes et les demandes d'extraction :

> Should we use PostgreSQL or MySQL for this?

PostgreSQL, better JSON support and stronger type system.

5. Citations avec sources

Pour la rédaction académique, journalistique ou technique :

> 78% of developers report using markdown daily.
>
> An interesting article on markdown, 2025

Styliser les blockquotes avec CSS

La démarque pure n’a aucune option de style. Les blockquotes s'affichent comme la plateforme le décide. La plupart des moteurs de rendu utilisent par défaut une bordure gauche, du texte gris et un peu de remplissage.

Style personnalisé sur votre propre site

Si vous publiez une démarque sur un site que vous contrôlez (Jekyll, Hugo, Ghost, Next.js et similaire), remplacez le CSS <blockquote> :

blockquote {
  border-left: 4px solid #3498db;
  padding: 1em 1.5em;
  margin: 1.5em 0;
  background: #f8f9fa;
  font-style: italic;
  color: #555;
}

blockquote p:last-child {
  margin-bottom: 0;
}

Remplacement HTML en ligne

Lorsque vous avez besoin d'un style de blockquote spécifique dans le markdown et que la plate-forme autorise le HTML brut :

<blockquote style="border-left: 4px solid #e74c3c; padding-left: 1em; color: #666;">
  This is a custom-styled quote.
</blockquote>

Cela fonctionne sur GitHub, la plupart des générateurs de sites statiques et Ghost. Cela ne fonctionne pas sur Reddit, Discord ou Slack (qui suppriment le HTML en ligne).


Compatibilité des plateformes

Les blockquotes sont l’une des fonctionnalités de démarque les plus universellement prises en charge. Ils fonctionnent presque partout, mais avec des variantes spécifiques à la plate-forme qui méritent d'être connues.

| Platform       | Blockquotes | Nested | GitHub Alerts | Callouts    |
| -------------- | :---------: | :----: | :-----------: | :---------- |
| GitHub (GFM)   | Yes         | Yes    | Yes           | No          |
| GitLab         | Yes         | Yes    | Partial       | No          |
| Bitbucket      | Yes         | Yes    | No            | No          |
| Reddit         | Yes         | Yes    | No            | No          |
| Discord        | Yes         | No     | No            | No          |
| Slack          | Yes         | No     | No            | No          |
| Notion         | Yes         | Yes    | No            | No          |
| Obsidian       | Yes         | Yes    | As callout    | Yes         |
| Stack Overflow | Yes         | Yes    | No            | No          |
| Jekyll / Hugo  | Yes         | Yes    | Via plugin    | No          |

Notes spécifiques à la plateforme

Discord prend en charge les guillemets sur une seule ligne et sur plusieurs lignes, mais ne prend pas en charge l'imbrication. Utilisez > pour une seule ligne ou >>> au début pour une citation sur plusieurs lignes qui continue jusqu'à la fin du message.

Slack affiche > sous forme de guillemets mais ne prend pas en charge l'imbrication. Les guillemets sur plusieurs lignes nécessitent > sur chaque ligne.

Reddit nécessite une ligne vide avant toute citation de bloc pour que le rendu soit possible. C’est la raison la plus courante pour laquelle les blockquotes échouent sur Reddit.

Notion convertit automatiquement l'entrée > en son propre bloc Quote. Les guillemets imbriqués nécessitent de faire glisser les blocs les uns dans les autres.

Pour plus de bizarreries de plate-forme, consultez notre guide de compatibilité complet dans l’aide-mémoire du pilier.


Erreurs et correctifs courants

1. Blockquote ne s'affiche pas

Cause : Ligne vide manquante avant ou après la citation.

Cassé:

Here is regular text.
> This should be a blockquote.
More text.

Fixé:

Here is regular text.

> This should be a blockquote.

More text.

La plupart des analyseurs pardonnent cela, mais les plus stricts (y compris Reddit) exigent des lignes vides de chaque côté.

2. La citation de plusieurs paragraphes se divise en deux

Cause : La ligne vide entre les paragraphes n'a pas de >.

Cassé:

> First paragraph.

> Second paragraph (this becomes a separate blockquote).

Fixé:

> First paragraph.
>
> Second paragraph (now part of the same blockquote).

La ligne de séparation vide doit toujours contenir >.

3. L'alerte GitHub s'affiche sous la forme d'une simple citation de bloc

Cause : La balise d'alerte se trouve sur la mauvaise ligne, est mal masquée ou comporte des espaces supplémentaires.

Cassé:

> [!note]
> This is a note.

Le type doit être en majuscule :

Fixé:

> [!NOTE]
> This is a note.

Vérifiez également que la balise se trouve sur sa propre ligne, sans rien après sur la même ligne.

4. Le blockquote imbriqué se réduit à un seul niveau

Cause : Caractères > manquants ou incohérents dans les lignes imbriquées.

Cassé:

> Outer quote.
>> Nested quote.

Espace manquant entre > et > :

Fixé:

> Outer quote.
>
> > Nested quote.

Mettez toujours un espace entre chaque caractère > lors de l'imbrication et incluez une ligne > vide avant l'imbrication.

5. Bloc de code à l'intérieur des sauts de citation

Cause : Il manque > sur les lignes de clôture.

Cassé:

> Here's some code:
```javascript
console.log("bonjour");```
> Back to the quote.

Fixé:

> Here's some code:
>
> ```javascript
> console.log("bonjour");
>```
>
> Back to the quote.

Chaque ligne, y compris les lignes de clôture, nécessite le préfixe >.

6. Les lignes de continuation paresseuses s'affichent sous forme de paragraphe normal

Cause : L'analyseur ne prend pas en charge la continuation paresseuse.

Risqué:

> First line of the quote.
Second line without >.

Toujours en sécurité :

> First line of the quote.
> Second line with >.

Meilleures pratiques en matière de blockquote Markdown

Les blockquotes sont l’une des fonctionnalités de démarque les plus polyvalentes. Ils prennent en charge tout, des simples citations aux appels et alertes complexes.

Lorsque quelque chose ne s'affiche pas comme prévu, vérifiez les règles de formatage courantes ci-dessus. La plupart des problèmes proviennent de caractères > manquants ou de problèmes d'espacement.


Questions fréquemment posées

Qu'est-ce qu'un blockquote en markdown ?

Une citation en bloc est un bloc de texte visuellement distinct du contenu environnant, généralement avec une bordure gauche, un remplissage et parfois du texte en italique ou en sourdine. En démarque, toute ligne commençant par > fait partie d'un blockquote.

Puis-je imbriquer des blockquotes dans le markdown ?

Oui. Ajoutez un autre > pour chaque niveau d'imbrication, > > pour deux niveaux, > > > pour trois, et ainsi de suite. Mettez toujours un espace entre chaque caractère >.

Comment terminer une citation ?

Laissez une ligne vide (sans >) après la dernière ligne citée. La ligne de texte suivante sera un paragraphe normal.

Puis-je mettre des blocs de code dans une citation ?

Oui. Utilisez des blocs de code clôturés (triples backticks) et préfixez chaque ligne, y compris les lignes de clôture, avec >.

Pourquoi mon alerte GitHub ne s'affiche-t-elle pas en couleur ?

Les alertes GitHub s'affichent uniquement sur GitHub lui-même (y compris les problèmes GitHub, les demandes d'extraction, les wikis et les README). En dehors de GitHub, ils reviennent aux guillemets normaux avec le texte « [!NOTE] » visible. Vérifiez également que le type d'alerte est en majuscule et sur sa propre ligne.

Quelle est la différence entre un blockquote et un callout ?

Un blockquote est une démarque standard (>). Une légende est une variante stylisée, les alertes GitHub et les légendes Obsidian utilisent la syntaxe blockquote avec une balise supplémentaire ([!NOTE], [!warning]) pour déclencher un style spécial. Les légendes sont des extensions de plate-forme, et non des démarques principales.

Comment citer quelqu'un et ajouter une attribution ?

Ajoutez une ligne après la citation avec la source :

> Premature optimization is the root of all evil.
>
> Donald Knuth

Puis-je styliser des citations avec des couleurs personnalisées ?

Pas avec une démarque pure, les blockquotes héritent du style appliqué par la plate-forme. Sur un site que vous contrôlez, remplacez le CSS <blockquote>. Dans le contenu markdown, utilisez du HTML brut avec des styles en ligne si la plate-forme le permet.

Les blockquotes fonctionnent-ils dans toutes les versions de démarque ?

Oui. Les blockquotes font partie de la spécification originale de John Gruber et sont pris en charge par tous les analyseurs de démarques, notamment CommonMark, GFM, MultiMarkdown, Pandoc et les variantes de plate-forme telles que Discord, Slack et Reddit.

Pourquoi ma citation se brise-t-elle sur Reddit ?

Reddit nécessite une ligne vide avant toute citation de bloc. De plus, la démarque de Reddit est plus stricte que celle de GFM, si le « > » ne commence pas au début d'une ligne (sans espaces de début), il ne sera pas rendu.

Puis-je avoir un blockquote vide ?

Techniquement oui, > sur sa propre ligne produit un bloc vide entre guillemets, mais c'est rarement utile. La plupart des analyseurs affichent simplement une fine bordure sans contenu.

Quelle doit être la longueur d'une citation ?

Il n'y a pas de limite technique. Stylistiquement, les citations courtes (une ou deux phrases) fonctionnent bien comme citations extraites. Les citations plus longues (un paragraphe ou plus) fonctionnent pour les citations étendues. Si une citation dépasse quelques paragraphes, envisagez plutôt de la paraphraser ou de la résumer.