Dernière mise à jour le 13.04.2016.

Markdown & Pygments Lexers

Ceci est un guide qui me servent pour me souvenir de toutes les possibilités qui offre markdown et Pygments pour éditer et formater du texte et que j'emploi pour créer des articles sur ce blog. Il est rédigé de telle sorte que non seulement il me servent de guide à moi, sinon a toute personne qui s'approche pour la première fois au langage markdown ou Pygments.

Ce qui suit est une liste détaillée de toutes les fonctionnalités qui peuvent être utilisés dans Markdown et Markdown Extra (utilisant Python Markdown) et les lexers plus commun de Pygments pour la Coloration du Code Source.

• Markdown
  • Qu'est-ce que c'est Markdown?
• Sintaxe Markdown
  • Titres
  • Liens
  • Paragraphes
  • Format
  • Citations
  • Listes
  • Listes de définitions
  • Images
  • Tableaux
  • Code
  • Lignes Horizontales
  • Échappement des caractères
  • Notes de bas de page
  • Abréviations
  • Identificateurs d'En-tête
• Pygments
  • Lexers de Pygments plus commun pour la coloration de sintaxe

Remarque Très Importante: Lorsque je parle de coloration tout au long de cet article, je veux dire que le code source est mis en surbrillance graçe a l'utilisation de Lexers de Pygments plus commun pour la surbrillance de sintaxe.

Markdown

Ceci est le langage de balisage utilisé pour créer les articles de ce blog, qui permet le formatage du texte facilement sans avoir besoin d'utiliser le plus empoisonnant HTML ou utilisez un éditeur visuel.

Je l'utilise plus de trois ans sur le blog de BlindHelp!

Qu'est-ce que c'est Markdown?

Markdown
est un langage de balisage léger semblable qui est utilisé dans de nombreux wikis et initialement issu des conventions existantes de balisage des courriels électroniques. Il utilise le texte brut, veillant à ce qu'il soi lisible mais arrivant à être converti en XHTML correctement formatés. Une grande partie des articles publiés sur ce blog sont préparés utilisant markdown, sans utilisez aucun type d'éditeur visuel WYSIWYG, ce qui facilite la création de documents XHTML propre et facilement éditables dans l'avenir. Ils sont un bon exemple des capacités de Markdown. Bien que celui-ci n'est pas bien connu, il commence à être très populaire et à être utilisé entre les programmeurs.

Pour en savoir plus sur markdown, vous pouvez lire les
articles externes
rélatif à Markdown qui expliquent pourquoi c'est le plus appropriée pour créer le contenu d'un blog, un document markdown, etc, etc.

Sintaxe Markdown

Titres

Les titres HTML se produisent en plaçant un certain nombre de dièses(signe) # avant le texte correspondant au niveau du titre souhaité (HTML offre jusqu'à six niveaux). Vous pouvez voir les titres possibles dans le tableau suivant:

# Ceci est un H1

## Ceci est un H2

### Ceci est un H3

#### Ceci est un H4

##### Ceci est un H5

###### Ceci est un H6

Vous pouvez enfermer chaque titre entre dièses (signe) #, pour des raisons purement esthétiques, parce qu'il n'est pas nécessaire du tout de le faire, c'est-à-dire, vous pouvez faire ceci:

### Ceci est un H3 ###

Pour les titres des deux premiers niveaux il existe également une autre façon de faire la même chose, qui serait la suivante:

Ceci est un H1
=============

Ceci est un H2
-------------

C'est-à-dire, pour les titres principaux vous souligner le texte avec le signe égal. Pour les titres de deuxième niveau vous utilisés les tirets pour souligner. C'est indifférent le nombre de signes égal ou tirets que vous utilisé, avec un c'est suffisant.

Liens

il existe également deux façon de créer des liens, vous pouvez les voir dans le tableau suivant:

[Avec titre](www.winaide.net "titre")

[Sans titre](www.winaide.net)

[Lien 1][1], [Lien 2][2], [Lien 3][3]

 [1]: http://blindhelp.blogspot.fr/
 [2]: https://www.blogger.com/profile/15309682764063057542 "AFFICHER MON PROFIL COMPLET"
 [3]: http://www.winaide.net/

Il existe un moyen supplémentaire de créer des liens automatiques pour les adresses URL, simplement les enfermer entre les caractères inférieur < et supérieur >:

<http://blindhelp.blogspot.fr/>

Paragraphes

Pour créer des paragraphes, il faut laissé une ligne vide. De cette façon.

C'est le premier paragraphe.

C'est le deuxième paragraphe.

Pour créer un sault de ligne dans un paragraphe, il faut simplement laissés deux espaces à la fin du dernier mot de cette ligne, de cette façon:

Ceci est la première ligne 
et ceci est le saut de ligne.

Format

Le format de base du texte, c'est-à-dire, en gras et en italique, ils peuvent être réaliser de plusieurs façons:

**Ceci est en gras**

__Ceci est aussi en gras__

*Ceci est en italique*

_Ceci est aussi en italique_

***Ceci est en gras et en italique***

___Ceci est aussi en gras et en italique___

Vous pouvez utiliser indistinctement soit l'astérisque * comme le souligné _ toujours et lorsqu'ils sont pas mélangés, et ce qui détermine le format c'est le nombre d'entre eux avant et après le bloc de texte à formater. Un est en italique, deux est en gras, et trois tous les deux à la fois, ainsi de simple.

Citations

Pour créer des blocs de citation, utilisez le caractère supérieur > avant le bloc de texte. Dans le tableau ci-dessous vous pouvez voir les options pour les créer.

Ceci est une ligne normale

> Ceci fait partie d'un bloc de citation.
> Ceci fait partie du même bloc de citation.

> Ceci fait partie d'un bloc de citation.
Ceci continue le bloc, même s'il n'y a pas de symbole 'supérieur'.

La ligne vide termine le bloc.

Ceci est une ligne normale

> Ceci fait partie d'un bloc de citation.
> Ceci fait partie du même bloc de citation.
>
> > Ceci est un autre bloc de citation imbriqué.
> > Ceci fait partie du bloc imbriqué.
>
> Ceci fait partie du bloc de citation de premier niveau.

Listes

Markdown vous permet de créer deux types de listes, ordonnées et désordonnées, c'est-à-dire numérotées ou listes à puce. Pour distinguer les types, et comment ils sont créés, rien de mieux que les voir avec des exemples:

Liste numérotée (ordonnée)

1. Ceci est le premier élément
2. Ceci est le deuxième élément
3. Ceci est le troisième élément

Liste à puces (désordonnée)

* Un élément de la liste
* Un autre élément de la liste
* Le troisième élément de la liste

Vous pouvez également utiliser + (plus) et - (tiret) au lieu de *

* Un élément de la liste
+ Un autre élément de la liste
- Le troisième élément de la liste

Vous pouvez mélanger différents types de listes et imbriqués les unes à l'intérieur des autres.

1. Ceci est une liste ordonnée
2. Deuxième élément de la liste ordonnée
    1. Ceci est une liste ordonnée imbriqué  à l'intérieur d'une autre
        * Liste désordonnée imbriquée au troisième niveau
        * Deuxième élément de cette liste
    2. Ceci est le deuxième élément de la liste ordonnée imbriquée

Listes de définitions

Vous pouvez créer une liste de définitions, qui sont composés de termes et les définitions de les mêmes, comme s'il s'agissait d'un dictionnaire. Sa création est très simple:

Premier terme
 : Première définition

Deuxième terme
 : Deuxième définition

Vous pouvez appliquer plus d'une définition a un terme

Premier terme
 : Première définition
 : Deuxième définition

Deuxième terme
 : Deuxième définition

Vous pouvez appliquer plus d'une définition a un terme

Premier terme
Deuxième terme
 : Première définition

Troisième terme
 : Deuxième définition

Si nous laissons une ligne vide entre le terme et la définition, se créera un paragraphe pour la définition.

Premier terme

: Première définition

Deuxième terme
 : Deuxième définition

Une définition peut être composer de plusieurs paragraphes.

Premier terme
 : Première définition

Deuxième paragraphe de la première définition

Deuxième terme
 : Deuxième définition

Images

La façon de relier des images est fondamentalement la même utiliser pour créer des liens, avec une différence unique, vous ajouté le caractère exclamation ! au début de la paire de crochets qui définissent le nom du lien. Exemples:

Vous tapez	Vous obtenez
![Image 1][1] ![Image 2][2]   [1]: pictures/avatar.png [2]: pictures/scaphandre.png "scaphandre"

Tableaux

Créer des tableaux est très facil, simplement il faut indiquer quels sont les éléments d'en-tête et séparer les champs avec le symbole (barre verticale) |

En-tête A | En-tête B
-- | --
Champ A0 | Champ B0
Champ A1 | Champ B1

Si vous le souhaitez, pour l'esthétique, vous pouvez aligner les colonnes et même de commencer et de terminer les lignes avec le symbole (barre verticale) |, mais il n'est pas du tout nécessaire.

| En-tête A | En-tête B |
| ---------- | ---------- |
| Champ A0   | Champ B0   |
| Champ A1   | Champ B1   |

Vous pouvez spécifier l'alignement de chaque colonne en ajoutant deux points à les lignes de séparation. Deux points à la gauche de la ligne de separation fera que la colonne est aligné à la gauche, deux points à la droite de la ligne de separation fera que la colonne est aligné à la droite, deux points à les deux côtés signifie que la colonne est aligné au centre.

| Élément | Quantité | Prix |
| :------- | :------: | -----: |
| Item 1   | 15       | 150€   |
| Item 2   | 3250     | 23,65€ |

Code

Vous pouvez créer des blocs de code pour héberger des extraits de code source d'un lenguaje de programmation ou pour reproduire littéralement n'importe quel type de texte sans qui soit interprété par Markdown. La seule chose nécessaire est que chaque ligne de ce bloc commence par au moins 4 espaces ou 1 tab.

De toute façon, est hautement recommandé pour ces tâches Utilisez la coloration de code qui est spécifiée sur
Cette section.

Ceci est un paragraphe normal.  

    Ceci est un paragraphe de code.

Ceci est un paragraphe de code.

Existe un autre moyen de créer un bloc de code, est de l'enfermer entre deux lignes formées par trois ou plusieurs caractères tilde ~

Ceci est un paragraphe normal

~~~
Ceci est un paragraphe de code.
~~~

Ceci est un paragraphe de code.

Enfin, il y a une option pour mettre en coloration des petits morceaux de code à l'intérieur des paragraphes de texte normal. Pour y parvenir, nous devons enfermer le code entre deux accents graves `

Ceci est un paragraphe normal, avec un morceau de code, `import this` inséré au milieu de celui-ci.

Lignes Horizontales

Pour créer des lignes horizontales, vous devez créer une ligne vides et composé par 3 ou plusieurs symboles, qui peuvent être des tirets, astérisques ou des soulignés. Vous pouvez créer des espaces entre ces caractères si vous le souhaitez par esthétique.

***

- - -

___

Échappement des caractères

Qu'est-ce qui se passe-t-il lorsque nous voulons afficher un caractère que Markdown utilise pour le balisage? C'est possible que selon d'où et de comment, c'est employer ce symbole, qui est interprété par Markdown et nous modifie le format ddu texte. Dans ce cas ce qui est nécessaire c'est échapper le caractère avec le symbole backslash ou barre oblique inversée \ Ce tableau montre les symboles qui peuvent être échappé par Markdown.

\\ \` \* \_  \{\} \[\] \(\) \# \+ \- \. \! \: \|

Notes de bas de page

Les notes de page sont créés d'une manière très simple en Markdown. Chaque notes de bas de page est composé de deux éléments: un marqueur à côté du texte qui devient un exposant et une définition qui peut être placée dans une liste de notes de bas à la fin du document. Exemple:

Ceci est un texte avec note de bas [^1]

[^1]: Ceci est une note de bas de page.

Les définitions de note de bas ils peuvent être trouvés n'importe où dans le document, mais les notes seront toujours affichés dans l'ordre dans lequel ils sont liés dans le texte. Il faut garder à l'esprit que vous ne pouvez pas faire deux liens vers la même note de bas: si vous essayez la référence de la deuxième note elle restera sous forme de texte sans format.

Chaque marqueur de note doit avoir un nom différent. Ce nom est utilisé pour lier la note à laquelle elle fait référence à des définitions de note, mais il n'a aucun effet sur la numérotation des notes de bas. Les noms peuvent contenir n'importe quel caractère valide qui sert à l'Identification d'un attribut HTML (c'est à dire, qui soit conforme à l'expression régulière [A-Za-z][-A-Za-z0-9_:.]*), ils ne doit pas nécessairement êtres des nombres. Exemple:

Ceci est un texte avec note de bas [^note1] et ceci est une autre note [^note2]

[^note1]: Ceci est une note de bas de page.
[^note2]: Ceci est la deuxième note de bas.

Abréviations

Pour créer des abréviations HTML la seule chose nécessaire est de créer une liste d'eux (généralement à la fin du texte) et n'importe où dans le texte qui apparaît l'abréviation s'appliquera automatiquement. Les listes des abréviations sont créés comme des listes de liens, mais précédés d'un astérisque.

La spécification HTML est maintenue par le W3C.

*[HTML]: Hyper Text Markup Language
 *[W3C]:  World Wide Web Consortium

Les abréviations sont sensibles à la casse, alors il doit être pris en compte. Vous pouvez créer des abréviations de plus d'un mot.

Identificateurs d'En-tête

Les identificateurs d'en-tête nous permettent d'établir un Identificateur à des en-têtes pour ensuite être en mesure de les relier dans n'importe quelle endroit que soient placé le texte. C'est ce qui me permet de créer l'index de cette page. Cela fonctionnerait comme un anchor HTML (ancre) mais qui ne peut s'appliquer à des en-têtes.

### Ceci est un en-tête avec un  ID {#en-tête1}

[Lien vers cet en-tête](#en-tête1)

Dans Markdown Python tous les en-têtes sont par défaut associé à un ID qui dépend du même texte, bien que l'emporte toujours celui que nous établissons.

Pygments: Coloration de Syntaxe pour le Code Source

Pour introduire des exemples de code source sur ce site, activer la coloration (ou coloré) les syntaxe améliore la présentation et la lisibilité des mêmes. Existe différents moteurs qui nous permettent de réaliser cette fonction et Pygments est un des meilleurs. Il est réalisée en Python, donc, il s'intègre parfaitement avec le logiciel qui génère ce site et avec Python Markdown.

La coloration de code avec Markdown et Pygments est vraiment simple, il suffit de faire la même chose que nous ferions avec Markdown, mais en ajoutant un lexer de Pygments dans la première ligne. Un lexer est un identificateur du langage que nous tenons à coloré pour que la coloration soient faite correctement. Les lexers sont construits à l'aide de 2 caractères : suivi du nom du lexer, par exemple, :::python il serait le lexer pour identifier un fragment de code en langage Python.

On peut le voir mieux avec un exemple:

    :::python
    import lifetime
    
    for each_day in lifetime.days():
        carpe_diem()

import lifetime

for each_day in lifetime.days():
    carpe_diem()

Lexers de Pygments plus commun pour la coloration de sintaxe

Juste après je montre une relation des lexers plus commun utilisé pour la coloration de code source. Trouvé sur le net.

• apache - configuration Apache

  <VirtualHost *:80>
  DocumentRoot /www/example1
  ServerName www.example1.com
  
  # Other directives here
  
  </VirtualHost>
  

• bash et console - Bash et Shell

   #!/bin/bash
   echo "Salut tout le monde"
  

• bat - Fichier Batch DOS/Windows

  @echo Salut, tout le monde!
  

• boo - Boo

  print "Hello, world!"
  

• c - C

  #include <stdio.h>
  
  int main()
  {
      printf("Salut tout le monde!\n");
      return 0;
  }
  

• cpp - C++

  #include <iostream.h>
  using namespace std;
  
  int main() {
    cout << "Salut tout le monde!" << endl;
    return 0;
  }
  

• csharp - C

  using System;
  
  class MainClass
  {
      public static void Main()
      {
          System.Console.WriteLine("Salut tout le monde!");
      }
  }
  

• css - Cascade Style Sheet (CSS)

  </pre>
     </td>
     <td class="get">
  <css>
  body {
      font: 75% georgia, sans-serif;
      color: #555753;
      background: #fff;
      margin: 0;
      padding: 5px;
  }
  

• diff ou udiff - Diff

  --- /path/to/original ''timestamp''
  +++ /path/to/new      ''timestamp''
  @@ -1,3 +1,9 @@
  +This is an important
  +notice! It should
  +therefore be located at
  +the beginning of this
  +document!
  +
   This part of the
   document has stayed the
   same from version to
  

• erlang - Erlang

  -module (salut).
  -export([salut_tout_le_monde/0]).
  
  salut_tout_le_monde() -> io:fwrite("Salut tout le monde!\n").
  

• go - Go

  package main
  
  import "fmt"
  
  func main() {
     fmt.Println("Hello World!")
  }
  

• haskell - Haskell

  salut tout le monde :: IO ()
  salut tout le monde = putStrLn "Salut tout le monde!"
  

• html - HTML

  <html>
    <head>
      <title>Salut tout le monde</title>
    </head>
    <body>
  
  Salut tout le monde!
     </body>
  </html>
  

• java - Java

  public class Salut tout le monde {
         public static void main(String[] args) {
            System.out.println("Salut tout le monde!");
         }
  }
  

• js - javascript

  <script type="text/javascript">
    document.write("Salut tout le monde!");
  </script>
  

• latex - LaTeX

  \documentclass[12pt]{article}
  \usepackage{lingmacros}
  \usepackage{tree-dvips}
  \begin{document}
  
  \section*{Notes for My Paper}
  

• cl - Common Lisp

  (format t "Salut tout le monde!")
  

• lua - Lua

  print("Salut tout le monde!\n")
  

• mysql - MySQL

  SELECT 'Salut tout le monde';
  

• pascal et delphi - Pascal et Delphi

  Program Salut tout le monde;
  Begin
      Write('Salut tout le monde!');
  End.
  

• perl - Perl

  print "Salut tout le monde\n"
  

• php - PHP

  <?php print "Salut tout le monde!"; ?>
  

• python ou py ou pycon ou pytb ou python3 ou cython - Python

  print "Salut tout le monde!"
  

• ruby - Ruby

  puts "Salut tout le monde"
  

• scala - Scala

  object HelloWorld extends Application {
    println("Hello world!")
  }
  

• scheme - Scheme

  (display "Hello World")
  

• smalltalk - Smalltalk

  Transcript show: 'Salut tout le monde!'
  

• sql - SQL

  SELECT 'Salut tout le monde'
  FROM DUAL;
  

• sqlite3 - sqlite3

  sqlite> CREATE TABLE tbl2 (
     ...>   f1 varchar(30) primary key,
     ...>   f2 text,
     ...>   f3 real
     ...> );
  sqlite>
  

• text - Texte simple espacement non proportionnel

  Salut tout le monde
  

• vala - Vala

  class Demo.HelloWorld : GLib.Object {
      public static int main(string[] args) {
          stdout.printf("Hello, World\n");
          return 0;
      }
  }
  

• vbnet - Visual Basic .NET

  Private Sub Form_Load()
     Msgbox "Salut tout le monde"
   End Sub
  

• vim - Vim Script

  function! ToggleSyntax()
     if exists("g:syntax_on")
        syntax off
     else
        syntax enable
     endif
  endfunction
  
  nmap <silent>  ;s  :call ToggleSyntax()<CR>
  

• xml - XML

  <?xml version="1.0" encoding="ISO-8859-1"?>
   - <note>
         <to>Tove</to>
         <from>Jani</from>
         <heading>Reminder</heading>
         <body>Don't forget me this weekend!</body>
     </note>
  

Articles externes

Voici quelques liens externes rélatif à Markdown que vous pouvez consulter:

Pour plus d'informations sur le langage Markdown Voici quelques pages en anglais à visitez):

Daring Firebal.

Daring Fireball: Markdown Web Dingus.

Daring Fireball: Markdown Syntax Documentation.

Sur ce, je vous souhaite une bonne découverte du langage Markdown!
Amusez-vous bien!
Nous espérons vous revoir bientôt sur le
Blog de BlindHelp!