Maybe I’m just late to the party, but the other day I learned how to add syntax highlighting in markdown code blocks – and it was almost life changing! Ok, I might be exaggerating a little bit – but it do make your code snippets more readable. And a lot of developer communities accept markdown in comments (and in posts) like dev.to, github etc.
Since Iām so excited about this I thought I should share it! And hopefully some of you will learn something new today š
Adding syntax highlighting is really easy, the only thing you have to do is add the programming-language after the first three back-ticks.
Here are some examples in markdown:
# Code blocks ## Below is an empty codeblock ``` ``` ## Below is a codeblock with javascript - without syntax highlighting ``` const myFunction = () => { console.log("This is my function"); } ``` ## Below is a codeblock with javascript - with syntax highlighting ```javascript const myFunction = () => { console.log("This is my function"); } ``` ## Below is a codeblock with powershell syntax highlighting ```powershell Connect-PnPOnline "yourtenantURL" -Interactive Get-PnPTenantAppCatalogUrl ```
And this is how the blocks will be displayed
Did you find this article usefull? Follow me on twitter to be notified when I publish something new!
Also, if you have any feedback or questions, please let me know in the comments below, or contact me via email.
Thank you for reading, and happy coding! š
/Eli
If you want to support my content you can
Hello Eli,
This is the second article from you that I have stumbled on in my studies. Decided to finally learn some markdown and I agree that highlighting with language defined is amazing!
I really appreciate your site design and clear and concise instructions and examples.
Keep up the good work!
Anders