Live Preview: Better support of code blocks in lists

lmao. Has this product died?

Ugh, ran into this bug today. Please fix.

1 Like

Subscribint to this issue.
I guess this is the kind of thing you can get done in logseq and it’s almost impossible in every other tool

2 Likes

+1
When will this be fixed? This is fundamental issue. Seriously considering cancelling my subscription as it seems devs don’t care to fix a very important problem.

2 Likes

Hi, may I offer a different perspective.

I’m a non-user, assessing moving from Notion to Obsidian. There are only two things stopping me from moving.

  1. Tables suck (fixed in 1.5, what good timing!) and
  2. I can’t nest code in an indented bullet list, which I do an enormous amount in my notes (writing a course)

So although maybe this isn’t the top most important feature for everyone, for this one person at least, it’s the only thing Obsidian needs for me to be able to switch from Notion.

And the fact that a two year old bug with so many comments isn’t fixed doesn’t give me the confidence to just switch now and trust it’ll be fixed soon.

6 Likes

Hi,

I am a recent one-month user who has just moved from Notion to Obsidian. I don’t regret my decision to move but I do wish the dev team could work on high priority fixes and features at a more time-efficient pace.

  1. I have tried the new table features in 1.5.0, but I can’t say they’re as robust as Notion’s implementation yet.
  2. This can be done in a precise way mentioned in someone’s post above.
    Basically write your code block on the root base level, select the entire code block and press Tab until it has as many indents as your current list level. Again, not as robust as Notion’s so I hope this gets a better UI/UX treatment.
2 Likes

For what it’s worth, I’d also enjoy this feature. I make do without using lists for this, but it would certainly be better if ordered and unordered lists supported indented code blocks. Support for this is common in documentation publication toolchains, and both MkDocs and Docusaurus for example support this style of code+steps at proper indentation. It would be great if it worked here, too. It seems to be a solved problem elsewhere, so it’s definitely possible. Thanks.

It seems that there is some upstream bug in HyperMD or codemirror as for the following case. The last two lines should not be recognized as part of the code block, but the syntax tree says they are.

Raw markdown

- ```python
	print
  ```

Here is outside the code block!

or

- ```python
print
```

Here is outside the code block!

LIve preview

Reading view

2 Likes

to 2.:
this is not a valid solution.
the tabs will be added to the code when using the copy function (clicking on the code-language indicator).
So tabbing the whole codeblock will ALTER the code (adding tabs), which is an absolute no-go!

2 Likes

I agree with @featurerequestaccoun that altering the code/blockquote with tabs to include it in a bullet or subbullet is not a great solution. I’m not sure how to fix this while staying in valid Markdown but this hampers what you can do with ‘outlining’ and lists. It’s also not intuitive to include the code block in deeply nested lists, I can never figure out how many indents to add before it’s correctly included. It’s fragile.

2 Likes

+1
I’m shocked this has been a large known bug for 2 years now and still not fixed. I often use Obsidian to write myself how-tos for programming and doing terminal stuff and want to have code blocks indented in numbered lists.

This seems like a pretty big missing part of markdown rendering for programmers (probably a fairly large portion of Obsidian’s user base).

6 Likes

+1

Just had to deal with this again. I avoided it by just no longer using lists again. But after a while of forgetting about this problem and wanting to use a basic feature like a list, bam, right back to shaking my fist at my nested code block experience.

1 Like

Just throwing my hat in to agree with everything said so far.

The least annoying way I’ve managed to do things so far is as follows:

  1. Make a list.
  2. Shift-Enter to add a new line for the triple backticks:
    Shift-Tab the code block until it's completely un-indented.
    
  3. Paste in your code.
  4. Select the entire code block and hit Tab as needed to re-indent to the correct level.
  5. ???
  6. Profit.

Source code for the list:

1. Make a list.
1. Shift-Enter to add a new line for the triple backticks:
    ```text
    Shift-Tab the code block until it's completely un-indented.
    ```
1. Paste in your code.
1. Select the entire code block and hit Tab as needed to re-indent to the correct level.
1. ???
1. Profit.

Amusingly, the syntax highlighting is broken on the block here.

For this step, it’s probably easier to just hit Enter repeatedly until the cursor is all the way to the left. (Apparently, many people don’t know that apps often implement the convention that hitting Enter undoes the automatic bulleting and indenting.)

That’s fair, I suppose I’m just used to treating it like other things I’m trying to enter inline on the same bullet point like images.