By @mhawksey

A SyntaxHighlighter Evolved WordPress plugin for Google Apps Script contributors

SyntaxHighlighter-GAS code editing and result
SyntaxHighlighter-GAS code editing and result

On the 10 March 2021 I’ll be celebrating 11 years of blogging about Google Apps Script. It all started with ‘Updating a Google Calendar and Google Site from a Google Spreadsheet’ and since I’ve published close to 200 posts on the topic.

As part of my published content I like to include useful code snippets. As I published on a self-hosted WordPress blog I’ve used plugins to help format the code to make it easier to understand and also aesthetically look nice.

Over the years I mostly used variants of plugins that have used the SyntaxHighlighter JavaScript package by Alex Gorbachev. This package has a number of ‘brushes’ for a long list of coding languages which provides online syntax highlighting that you get in most IDEs.. Given Apps Script is based on a JavaScript I’ve usually used this as the language identified for my code snippets.

This all changed when my preferred plugin, Syntax Highlighter Compress, started throwing errors when it was trying to render snippets. This plugin hasn’t been updated for 9 years and I imagine a core dependency has been removed from WordPress. Rather than trying to fix it I thought I would swap to SyntaxHighlighter Evolved, which is used also on

As I was swapping out plugins I also had a look at extending it to support Google Apps Script services. This is something I had looked at in the past as a fudgy fix, but this time wanted to do it properly. The result is the SyntaxHighlighter-GAS plugin which extends SyntaxHighlighter Evolved to include a Google Apps Script brush and also a code theme based on the one you find on the Google Developers site.

The plugin repo has basic information on installation and once setup you too can have lovely rendered code like this (screenshot if you are reading via RSS):

/** @OnlyCurrentDoc */
function sendMap() {
  var sheet = SpreadsheetApp.getActiveSheet();
  var address = sheet.getRange('A1').getValue();
  var map = Maps.newStaticMap().addMarker(address);
  GmailApp.sendEmail('YOUR_EMAIL', 'Map', 'See below.', {attachments:[map]});

Putting this plugin together was relatively easy thanks to a post from the plugins author Alex Mills on adding new brushes and this one on including new themes. Feel free to report issues/fixes. Happy scripting!

Exit mobile version