Markdown code syntax highlighting not working

• 

  stuartsquibb · Member · Oct 11, 2019 at 12:34 pm

  • Copy link
  • Add topic to favorites

  Hi,

  I can’t use Markdown syntax in my blog for code syntax highlighting. Any language I choose for the block gets rendered as plain text. Headings, lists and links all work, just not code syntax highlighting. I’ve tried “` and ~~~ fences around the code with no success.

  The blog I need help with is: (visible only to logged in users)

• 

  staff-zinnia · Staff · Oct 11, 2019 at 2:03 pm

  • Copy link

  Good morning –

  I’m happy to take a closer look at this. To clarify, are you using the code block?

  Please send me a link or post/page title where you’re having the trouble.

• 

  stuartsquibb · Member · Oct 11, 2019 at 2:11 pm

  • Copy link

  Hi,

  I’m using code fences within the Markdown block. I’ve got a draft post that demonstrates the problem:

  https://wordpress.com/block-editor/post/carisbrookelabs.wordpress.com/1130

  Regards,

  Stuart

• 

  staff-zinnia · Staff · Oct 11, 2019 at 6:07 pm

  • Copy link

  Thanks Stuart. I am taking a look at it now.

• 

  staff-zinnia · Staff · Oct 11, 2019 at 6:14 pm

  • Copy link

  Please take another look. All the text is not located with in the powershell.

• 

  stuartsquibb · Member · Oct 11, 2019 at 7:21 pm

  • Copy link

  I’ve removed everything from the Markdown block except the code. The problem still ocurrs.

• 

  staff-blorbo · Staff · Oct 11, 2019 at 9:41 pm

  • Copy link

  For syntax highlighting in Markdown, you’ll need to use three backticks and not ~~~~

  See under Syntax Highlighting at https://en.support.wordpress.com/markdown-quick-reference/

  Since that backtick character is also used to wrap code blocks in the forum, I can’t directly provide an example here, but I hope that makes sense. :)

• 

  stuartsquibb · Member · Oct 11, 2019 at 9:49 pm

  • Copy link

  Hi,

  I’ve tried both backticks and ~ . The Markdown guide you referenced says that either can be used, but no success.

  Stuart.

• 

  staff-blorbo · Staff · Oct 11, 2019 at 9:58 pm

  • Copy link

  You can use ~ and backticks for a non-highlighted code block, but as you can see under “Syntax highlighting” there, only backticks will work for syntax highlighting.

  Try three backticks instead of four ~

• 

  stuartsquibb · Member · Oct 11, 2019 at 10:04 pm

  • Copy link

  That’s where I started. Three backticks. Everything else was when that didn’t work properly. I’ve updated the draft post again. Still no joy.

• 

  staff-blorbo · Staff · Oct 11, 2019 at 10:23 pm

  • Copy link

  Hm, interesting, you are right, it does appear that syntax highlighting is broken in Markdown, sorry for not checking this before: https://cld.wthms.co/qWpTDh

  The Syntax Highlighter block works though: https://cld.wthms.co/My7MXk

  So, I recommend using that for now: https://en.support.wordpress.com/wordpress-editor/blocks/syntax-highlighter-code-block/

  This appears to be broken in Jetpack too, which is where the block comes from: https://cld.wthms.co/xXuSbV

  So, I did some digging there, and this does appear to be a known issue: https://github.com/Automattic/jetpack/issues/11881

  So, I definitely recommend just using the Syntax Highlighter block for now.

• 

  stuartsquibb · Member · Oct 11, 2019 at 10:33 pm

  • Copy link

  OK. Thanks for looking in to this. At least it wasn’t something I’d done! I’ll follow the issue on GitHub to see what happens.

  Stuart.