Gutenberg, Code, and Highlighting

One of the great things about Gutenberg is the ability to compartmentalize different types of content within blocks.  One of the blocks that I’ve been using a lot of recently is the code block.  This block by default will render something like this:

#include "stdio.h"
int main()
{
   // printf() displays the string inside quotation
   printf("Hello, World!");
   return 0;
}Code language: PHP (php)

While this is acceptable, it’s not very pretty.  I used to use the SyntaxHighlighter Evolved.  Unfortunately this doesn’t work perfectly with Gutenberg at the moment, and I was hoping for something in a block.  Luckily I found this…

UPDATE: SynxtaxHighlighter Evolved now works with Gutenberg, but I still like how code-syntax-block works with the core block and isn’t a block of its own.

Marcus Kazmierczak has made a plugin to extend the core code block to allow syntax highlighting:

#include <stdio.h>
int main()
{
   // printf() displays the string inside quotation
   printf("Hello, World!");
   return 0;
}Code language: PHP (php)

I really like this and I think it compliments Gutenberg nicely 🙂