Highlighting code in blog posts

Once upon a time, I wrote a plug-in for Windows Live Writer that took code that had been copied from Visual Studio to the clipboard and converted it to an HTML pre block for my blog posts. The different colors were maintained during this conversion (in essence VS copies the code as RTF) so that the code displayed here in my blog posts would be nicely highlighted. I even published it to GitHub so that it could also be used for Open Live Writer too.

That was then, but this is now.

Advantages: it’s all just HTML once in the blog post and doesn’t require any JavaScript to actively highlight the code. Disadvantages: I find I spend way more time in Sublime Text, and now in VSCode, than I ever do in Visual Studio. Recently I found myself opening VS just so that I could copy some code over, then copy it to the clipboard from there, and then paste it into WLW. Erm, yikes?

Time then for a more modern method of highlighting code in my posts. I did a bit of research and the JavaScript library that seems to be The One for this kind of work is Prism. The markup is minimal (a code element with a standard attribute inside a pre element) and you can customize which languages you support with the library.

So let’s try it.

Here’s the classic Prism markup:

<pre><code class="language-javascript">

Here’s a JavaScript function I use to associate Font Awesome with a bulleted list:

  var makeBlogListItemAwesome = function (jQueryObj) {
    jQueryObj.find("li").prepend("<i class='fa fa-chevron-right'></i>&nbsp;");

  var makeBlogListsAwesome = function (selectors) {
    selectors.forEach(function (selector) {

Finally, a C# function I use to calculate the date of the first post for the calendar widget I wrote.

    private DateTime GetDateOfFirstPost() {
      DateTime defaultDate = new DateTime(2000, 1, 1);

      string firstpost = ConfigurationManager.AppSettings["Graffiti::FirstPost"];
      if (string.IsNullOrEmpty(firstpost)) {
        return defaultDate;

      DateTime firstPostDate;
      if (!DateTime.TryParse(firstpost, out firstPostDate)) {
        return defaultDate;

      return firstPostDate;

And with that comes the undeniable question: do I go back and fix previous blog posts to use this library? It is Christmas after all…

Album cover for HorizonNow playing:
Carpenters - Please Mr. Postman
(from Horizon)

WrongWayNotAnExit - banner

Loading similar posts...   Loading links to posts on similar topics...

No Responses

Feel free to add a comment...

Leave a response

Note: some MarkDown is allowed, but HTML is not. Expand to show what's available.

  •  Emphasize with italics: surround word with underscores _emphasis_
  •  Emphasize strongly: surround word with double-asterisks **strong**
  •  Link: surround text with square brackets, url with parentheses [text](url)
  •  Inline code: surround text with backticks `IEnumerable`
  •  Unordered list: start each line with an asterisk, space * an item
  •  Ordered list: start each line with a digit, period, space 1. an item
  •  Insert code block: start each line with four spaces
  •  Insert blockquote: start each line with right-angle-bracket, space > Now is the time...
Preview of response