30

In Github/MD, if we want to enable code block when it is a child of list, we need to intent it by 8 spaces.

But how to make that code block has the syntax highlighting feature?

The following code does not work as expected...

    1. foo

             ```python
                print 'bar'
             ```

    2. bar

3 Answers 3

20
```python
print 'bar'
```

without spaces should work: from GitHub help page:

Just wrap your code blocks in ``` and you won't need to indent manually to trigger a code block.


As illustrated in hilz's answer below, you need to indent the ```` with the same indentation level + 2 spaces than your list.
The content of the code block doesn't need to be indented.

1. foo

  ````python
print 'bar'
  ````

  1.

    ````python
print 'bar'
    ````

See this gist as an example:

indented code block

Sign up to request clarification or add additional context in comments.

8 Comments

What I mean is they are inside a list, see my updated code. Thanks.
@Howard: list and pre-formatted code don't mixed together well. I prefer making the list manually in order to be sure pre-formatted code will be rendered correctly.
@VonC: What do you mean my ‘making the list manually’? Using the Markdown slash-dot escape syntax?
I tried this but my syntax highligted code block indentation doesn't follow the list it is in. @Howard did you really successfully use ``` to indent syntax highlighted code block in the middle of a list?
Unfortunately this does not seem to work anymore in the tracker - indending by 8 spaces works but it's less handy obviously
|
11

To get code blocks with syntax highlighting embedded happily in a list, embed the markup lines that come before and after the code block to the appropriate level of indenting for an additional paragraph, then proceed as normal. For example:

1. lorem ipsum

  ```ruby
resources :dolor
  ```

   1. sit amet

      ```ruby
resources :elit
      ```

   1. sed do

1. eiusmod

indents each code block to the appropriate depth and maintains the integrity of the indexes.

3 Comments

This works. I just had to indent the whole block with 2 spaces to make the code block part of the list item. I think this answers the question better than the accepted answer.
This should be the accepted answer as it actually solves the problem in the OP, that of a syntax-highlighted code block within a list.
This is not working any longer.
5

Nowadays, you have to do the following:

1. lorem ipsum
  ```perl
  use strict;
  ```
2. dolor sit amet
      ```perl
      use warnings;
      ```
   1. consectetur adipiscing elit
   1. sed do
1. eiusmod

That is, make sure your syntax-highlighted code starts in the same column as the backticks. You also have to help the numbering out a little bit, because it appears to lose count after code blocks.

See also: https://gist.github.com/therealbstern/9cb0dfc7f0f4b76a062247676aed341b

1 Comment

Shiki pointed this out in a comment above, under hilz's answer, but I needed to put this in an answer, because having the correct answer buried in a comment didn't seem clear enough. Also, comments don't allow full markdown, which is needed to make it abundantly clear.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.