Sublime Forum

Custom syntax highlighting in markdown code blocks

#1

I’d to specify the syntax highlighting rules for a code block in markdown, something like:

```mylanguagefoobar
```

I know how it works for existing languages (js, py, etc …) but I want to do it for a new language that is not yet supported. I can write the highlighting rules myself (whatever format is required even though sublime-syntax or tmLanguage would be best so I do the work once). I do know how to do it: https://www.sublimetext.com/docs/syntax.html

I think there was a similar question some time ago: Adding more syntax highlight to code blocks in markdown but there were no answers and it might have been about something different.

It would be very nice if markdown blocks could use any language installed to simplify the process of writing documentation in markdown.

Or maybe there is a way to get highlightjs to work somehow ? but I don’t want to store html in the markdown file

0 Likes
#2

You can do a few things,

Override using OverrideAudit, or extend the syntax with a new syntax.

0 Likes
#3

I raised a proposal/feature request for this at https://github.com/sublimehq/sublime_text/issues/5004 in case you want to add your vote to it to help the ST developers priortize

1 Like
#4

Thank you, not sure I see how to do it. If you happen to know from the top of your head would you mind giving more hints on how to do it ?

0 Likes
#5

Thank you, did as much.

0 Likes
#6

In your User package create a Markdown (Custom).sublime-syntax and paste the following content.

%YAML 1.2
---
name: Markdown (Custom)
scope: text.html.markdown.user
version: 2

extends: Packages/Markdown/Markdown.sublime-syntax

file_extensions:
  - md
  - mdown
  - markdown
  - markdn

contexts:

  fenced-syntaxes:
    # append rules to existing context
    - meta_append: true
    - include: fenced-custom

  fenced-custom:
    - match: |-
         (?x)
          {{fenced_code_block_start}}
          ((?i:cusom-syntax-name))
          {{fenced_code_block_trailing_infostring_characters}}
      captures:
        0: meta.code-fence.definition.begin.markdown-gfm
        2: punctuation.definition.raw.code-fence.begin.markdown
        5: constant.other.language-name.markdown
      embed: scope:source.custom-syntax
      embed_scope:
        markup.raw.code-fence.markdown-gfm
        source.custom-syntax
      escape: '{{fenced_code_block_escape}}'
      escape_captures:
        0: meta.code-fence.definition.end.markdown-gfm
        1: punctuation.definition.raw.code-fence.end.markdown

Replace custom-syntax-name and related source.custom-syntax scopes by the language of choice.

Note: MarkdownEditing already provides a lot of custom syntaxes in fenced code blocks and replaces ST’s one.

1 Like
#7

That works, thank you so much !
I have to change the syntax for each markdown file I edit needing this custom syntax but isn’t too bad until something better is built-in sublime. Or I’ll just need to make my custom markdown syntax the default.

0 Likes