Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I have a code block with a vertical scrolling feature in the Markdown on GitHub?

I'm dealing with one issue on GitHub and for that, the moderator is requesting me to share the output of certain bash commands in the comments. I'm sharing the output of requested commands in the form of code blocks and I know how to insert code block in Markdown:

The output of the command
.
.
.

However, the problem with the above syntax is that if the command output has let say 500 lines then it will display all the 500 lines in the Markdown output. In fact, there total of 3 such long code blocks in my comment. Because of that, code blocks consume a significant amount of space in my comment and my comment seems too long.

So, is there any way that my code block would display only a limited number of lines with a scrolling feature specific to that block only e.g. it should display only 10 lines, and for the rest of the lines, it should have vertical scrolling. Through this, my comment won't seem too long and the moderator would also be to focus on other non-command text (i.e. content other than code blocks) in my comment.

like image 792
Milan Avatar asked Jul 21 '20 21:07

Milan


People also ask

How do I add Codeblocks in Markdown?

To produce a code block in Markdown, simply indent every line of the block by at least 4 spaces or 1 tab. For example, given this input: This is a normal paragraph: This is a code block. A code block continues until it reaches a line that is not indented (or the end of the article).

How do I add a code block to GitHub?

You can create fenced code blocks by placing triple backticks ``` before and after the code block. We recommend placing a blank line before and after code blocks to make the raw formatting easier to read. Tip: To preserve your formatting within a list, make sure to indent non-fenced code blocks by eight spaces.

How do you highlight code in Markdown?

To highlight code, write the name of the language the code is written in after the initial triple backticks. In the above example, the code is written in JavaScript, and hence javascript is added after triple backticks.


1 Answers

GitHub Flavored Markdown allows you to use html tags. So you can use details html block to hide your long code.

<details>
  <summary>
    summary
  </summary>
  details
</details>

It looks like this collapsed:

Collapsed

and expanded:

Expanded

like image 136
grzegorzorwat Avatar answered Sep 23 '22 12:09

grzegorzorwat