80

I know I can use "code" in GitHub Flavored Markdown to highlight a code snippet. But I am not able to display line numbers for a snippet. Is there a way to do so?

```javascript
var s = "JavaScript syntax highlighting";
alert(s);
```

I want a line number to be put at the beginning of each line, like this:

1    var s = "JavaScript syntax highlighting";
2    alert(s);
John Y
  • 14,123
  • 2
  • 48
  • 72
derek
  • 9,358
  • 11
  • 53
  • 94
  • 1
    I know it is not an answer to your question but you can try to using embedded Gist in your Readme/wiki pages. http://stackoverflow.com/questions/11622509/github-how-to-embed-a-gist-into-readme-md – GabrielOshiro Mar 25 '16 at 19:08
  • Related question on Meta.SE: https://meta.stackexchange.com/questions/7119/why-are-there-no-line-numbers-in-the-code-listings – John Y Jun 11 '19 at 18:00
  • This could be useful https://docs.github.com/en/get-started/writing-on-github/working-with-advanced-formatting/creating-a-permanent-link-to-a-code-snippet – mihkov Feb 10 '22 at 20:30
  • Line number are not in standard markdown standard, but some libraries might implement extended functionality such as the one you want. Just look around for a library that offers it. – 99problems May 25 '23 at 15:32

8 Answers8

42

As you may noticed in Markdown Cheatsheet, GitHub does not show line numbers in code blocks.

denysdovhan
  • 908
  • 8
  • 21
7

As a hack, you could save a pic of your code at https://carbon.now.sh and post it; they support line numbers as an option.

Birch
  • 211
  • 2
  • 8
  • 50
    I cry whenever I can't copy and paste code from code blocks :( – Raphael Oct 16 '20 at 04:52
  • 1
    As a hack, you could include the source-code in another way into your markdown. of course... But does this answer the question? The question was how to do this using plain "GitHub Flavored Markdown code" and not using anything else. – anion May 24 '22 at 07:59
6

You can get something similar that you need using awk '{printf("% 4d %s\n", NR, $0)}' StartDsl.scala where StartDsl.scala is your source code file. Paste the result between

```scala
<your code here>
```
jseteny
  • 412
  • 1
  • 6
  • 10
6

Although it is not available in GitHub as the question asks, I have discovered today if you add an = sign after the opening line, on some Markdown editors, it gives the desired result.

eg:

```javascript=
var s = "JavaScript syntax highlighting";
alert(s);
```

This works on Markdown editors such as HackMD

See your example on HackMD

Callum Atwal
  • 144
  • 1
  • 11
5

So, you will need to help yourself by adding css to your html page. As a code goes into <pre> </pre> block in markdown.

You could apply your logic to this block to put line number against each line.

See https://codepen.io/heiswayi/pen/jyKYyg for reference.

Vinay Prajapati
  • 7,199
  • 9
  • 45
  • 86
4

I use RStudio with RMarkdown to render my Markdown (.md) files. It works great. Using the RMarkdown, the specification is made this way:

```{.javascript .numberLines .lineAnchors}
var s = "JavaScript syntax highlighting";
alert(s);
```

Yes, there are many markdown editors available and I'm not sure that this will work with all the editors, but RStudio/RMarkdown is a really great tool, which I use since a long time ago (IMHO).

Eduardo Alvim
  • 201
  • 2
  • 4
-3

Just add an = after the language you choose !

```java=
java code exemple:
int i = 5
```java=
Simon B
  • 503
  • 12
  • 29
-7

Now here is the solution for adding line numbers in Markdown.

https://shd101wyy.github.io/markdown-preview-enhanced/#/markdown-basics?id=line-numbers

You can enable line number for a code block by adding line-numbers class.

Ang
  • 13
  • 1
  • 6
  • it is working for my text-editor with markdown plugin, but I couldn't see any line numbers in github code-blocks (in my comments for code at least) – max.underthesun Mar 21 '18 at 06:12
  • 4
    Dude, this is MPE and not part of GitHub... "Markdown Preview Enhanced is a SUPER POWERFUL markdown extension for Atom and Visual Studio Code. The goal of this project is to bring you a wonderful markdown writing experience." – Shanerk Apr 07 '18 at 12:41