Ionică Bizău
Ionică Bizău

Reputation: 113345

How to highlight bash/shell commands in markdown?

How can I highlight the Bash/shell commands in Markdown files?


For example, to highlight js, I write:

```js
function () { return "This code is highlighted as Javascript!"}
```

To highlight HTML code I use ```html.

How can we highlight Bash/shell commands?

Upvotes: 606

Views: 739156

Answers (11)

Jiri
Jiri

Reputation: 55

In VS Code Linux Ubuntu works nicely

```bash
docker exec -it ollama /bin/bash
```

Upvotes: 0

noraj
noraj

Reputation: 4622

Context

Markdown standard, is named commonmark.

Markdown markup-language is just a pre-processor to HTML, it's transpired to HTML.

Nor markdown nor HTMl supports code syntax highlight. But on fenced code blocks, an info string can be passed from markdown to HTML.

An info string can be provided after the opening code fence. Although this spec doesn’t mandate any particular treatment of the info string.

For example, this info string (ruby)…

```ruby
def foo(x)
  return 3
end
```

…will be pass to HTML like this…

<pre><code class="language-ruby">def foo(x)
  return 3
end
</code></pre>

… in a class attribute and prefixed with language-.

Outside proving a class that can be used in CSS, this does nothing. To obtain code syntax highlight, you need to use a syntax highlight library that can either be handled on the backend (server-side) and rendered into the HTML directly, or a front-end (client-side) JavaScript library that colors the code in the web browser.

So the reference code you put into the info string DEPENDS on the syntax highlight library you'll use.

Libraries

There are :

  • sh, bash, zsh, fish, ksh and so on for the content of a script so usually commands with the internal syntax of the shell language.
  • shell or similar for CLI commands, highlighting with different colors the main command sub-commands, arguments, strings, etc.
  • console, shellsession, bash session or similar for shell sessions (prompt + command + output)

For shell sessions, here are the common references for the most common syntax highlight libraries:

  • Rouge (github)) uses console.
  • linguist uses ShellSession, bash session, console.
    • GitHub and it's non-standard GFM (GitHub flavored Markdown) uses their own library named linguist for what is used all comments and descriptions in issues, pull request, descriptions, etc.
  • Highlight.js (doc) has nothing for shell sessions.
    • but has shell and console for CLI commands.
  • Prism.js uses shell-session, sh-session, shellsession.
    • Here shell is an alias for bash and sh.
  • EnlighterJS has nothing for shell sessions.
    • Here shell is an alias for bash.
  • Chroma has something called Session.
  • Pygments (doc) uses console, shell-session for bash sessions, pwsh-session, ps1con for power shell sessions and many other non-shell sessions are supported too like interpreter of may languages.
  • Torchlight (doc) has nothing for shell sessions.
    • but has shell for CLI commands.

Plugins

Some markdown rendering engine or syntax highlighter have some extensions / plugins to renders prompt, command and outputs separately like Prism.js Command Line plugin.

Other features

Some like Bright brings some features like tab icon, titles, etc.. Some have native features to add numbering, highlight a line, etc.

Upvotes: 0

Nick
Nick

Reputation: 189

```shell
your command line
```

OR

```bash
your command line
```

Upvotes: 1

wuan
wuan

Reputation: 136

In Obsidian, you can use sh-session

https://prismjs.com/

Upvotes: 1

Anton Strogonoff
Anton Strogonoff

Reputation: 34032

If you are looking to highlight a shell session command sequence as it looks to the user (with prompts, not just as contents of a hypothetical script file), then the right identifier to use at the moment is console:

```console
foo@bar:~$ whoami
foo
```

GitHub Markdown preview tab screenshot

Upvotes: 708

g.annunziata
g.annunziata

Reputation: 3266

If I need only to highlight the first word as a command, I often use properties:

```properties
npm run build
```  

I obtain something like:

npm run build

Upvotes: 55

AlvvaysPaul
AlvvaysPaul

Reputation: 46

Bitbucket uses CodeMirror for syntax highlighting. For Bash or shell you can use sh, bash, or zsh. More information can be found at Configuring syntax highlighting for file extensions and Code mirror language modes.

Upvotes: 2

Alireza Fattahi
Alireza Fattahi

Reputation: 45475

I found a good description at Markdown Cheatsheet:

Code blocks are part of the Markdown spec, but syntax highlighting isn't.

However, many renderers -- like GitHub's and Markdown Here -- support syntax highlighting. Which languages are supported and how those language names should be written will vary from renderer to renderer. Markdown Here supports highlighting for dozens of languages (and not-really-languages, like diffs and HTTP headers); to see the complete list, and how to write the language names, see the highlight.js demo page.

Although I could not find any official GitHub documentation about using highlight.js, I've tested lots of languages and seemed to be working

To see list of languages I used https://github.com/highlightjs/highlight.js/blob/master/SUPPORTED_LANGUAGES.md

Some shell samples:

Shell:      console, shell
Bash:       bash, sh, zsh
PowerShell: powershell, ps
DOS:        dos, bat, cmd

Example:

```bat
cd \
copy a b
ping 192.168.0.1
```

Upvotes: 97

irJERAD
irJERAD

Reputation: 610

Using the knitr package:

```{r, engine='bash', code_block_name} ...

E.g.:

```{r, engine='bash', count_lines}
wc -l en_US.twitter.txt
```

You can also use:

  • engine='sh' for shell
  • engine='python' for Python
  • engine='perl', engine='haskell' and a bunch of other C-like languages and even gawk, AWK, etc.

Upvotes: 19

hek2mgl
hek2mgl

Reputation: 157947

It depends on the Markdown rendering engine and the Markdown flavour. There is no standard for this. If you mean GitHub flavoured Markdown for example, shell should work fine. Aliases are sh, bash or zsh. You can find the list of available syntax lexers here.

Upvotes: 525

MmmHmm
MmmHmm

Reputation: 3785

Per the documentation from GitHub regarding GFM syntax highlighted code blocks

We use Linguist to perform language detection and syntax highlighting. You can find out which keywords are valid in the languages YAML file.

Rendered on GitHub, console makes the lines after the console blue. bash, sh, or shell don't seem to "highlight" much ...and you can use posh for PowerShell or CMD.

Upvotes: 18

Related Questions