# Les blocs Callout de Quarto > Découvrez la syntaxe des blocs Callout de Quarto pour créer des encadrés qui attirent l'attention (Tips, Warnings, Cautions) dans vos rapports. Inclut un snippet VSCode bien pratique. ---  **TL;DR** Cet article présente la syntaxe des blocs callout de Quarto (`:::{.callout-caution}`, `:::{.callout-tip}`, etc.) pour créer des encadrés mis en évidence dans les sorties PDF, HTML et revealJS — l'équivalent Quarto de l'`` de Docusaurus — et fournit un snippet VSCode qui vous demande de façon interactive le type de callout, le titre et le contenu, pour ne plus jamais avoir à retenir la syntaxe exacte. Un callout (appelé *admonition* par [Docusaurus](https://docusaurus.io/docs/markdown-features/admonitions)) est une syntaxe spéciale utilisée pour mettre un paragraphe en évidence, par exemple un encadré *Faites attention à...* ou *Astuce : saviez-vous que...*. *Du côté de Docusaurus, j'ai abordé cette syntaxe dans [Some tips and tricks when written articles for Docusaurus](/blog/docusaurus-articles-tips).* Sur ce blog propulsé par Docusaurus, la syntaxe d'une *admonition* est ```markdown Never give your bank card code to a stranger. ``` et le rendu est le suivant > **Faites attention à...:** > > Ne donnez jamais le code de votre carte bancaire à un inconnu. Et maintenant une petite astuce : > **Saviez-vous que...:** > > En vous couchant plus tôt, vous aurez un sommeil de meilleure qualité. Quarto implémente cela un peu différemment, voyons donc comment... > **Image Docker avec Quarto:** > > Si vous n'avez pas encore d'image Docker avec Quarto, lisez cet article : [Running Quarto Markdown in Docker](/blog/docker-quarto). ## Syntaxe {#syntax} Malheureusement, cette syntaxe ne fait pas partie du langage Markdown standard : chaque outil a donc la sienne. Pour Quarto, la syntaxe est : ```markdown :::{.callout-caution} ## Pay attention to... Never give your bank card code to a stranger. ::: ``` Et ce paragraphe est converti comme ceci en PDF :  La syntaxe Quarto pour une astuce est : ```markdown :::{.callout-tip} ## Did you know that... By going to bed earlier, you'll get better quality sleep. ::: ```  Les callouts sont supportés en PDF, HTML, revealJS et d'autres formats. Retrouvez la syntaxe en détail dans la [documentation officielle](https://quarto.org/docs/authoring/callouts.html). ## Snippet VSCode {#vscode-snippet} Si vous utilisez VSCode, ne faites pas l'effort de retenir la syntaxe exacte : utilisez la fonctionnalité *Snippet* de VSCode. Appuyez sur `CTRL`-`SHIFT`-`P` pour accéder à la **Command Palette**. Commencez à taper `Configure User Snippets`, validez et sélectionnez `markdown.json` puisque nos snippets ne doivent être disponibles que lors de l'écriture de contenu Markdown.  S'il s'agit de votre premier snippet, le fichier JSON sera vide. Copiez/collez le texte ci-dessous. Sinon, copiez simplement le nœud `callout` et collez-le au bon endroit dans votre fichier. **markdown.json** ```json { "callout": { "prefix": "quarto-callout", "body": [ ":::{.callout-${1|note,tip,warning,caution,important|}}", "## ${2:title}", "${3:body}", ":::" ], "description": "Add a callout paragraph to your markdown file" } } ``` Enregistrez et fermez le fichier `markdown.json`, puis retournez dans n'importe quel fichier markdown (ou créez-en un nouveau). Maintenant, en tapant `quarto` puis en appuyant sur `CTRL`-`space`, VSCode affichera la liste des possibilités pour ce mot et vous y retrouverez votre snippet. Sélectionnez-le et appuyez sur `Enter` pour valider.  Et, comme vous pouvez le voir sur l'image ci-dessous, VSCode va vous demander trois choses : 1. D'abord le type de callout, avec une liste de valeurs possibles ; facile, non ? 2. Ensuite, après avoir appuyé sur la touche `tab`, il vous sera demandé de saisir un titre et, enfin, 3. Le contenu de votre paragraphe.  VSCode vous montre le snippet de façon interactive et vous pouvez ainsi le créer facilement, sans avoir à retenir la syntaxe exacte. ```markdown :::{.callout-caution} ## Pay attention to... Never give your bank card code to a stranger. ::: ```