Markdown is a great language that lets you focus on writing. Out of the box, Umbraco provides a markdown editor that you can use to simply and quickly add and edit content, for instructions on how to do this, look here

The big issue I encountered when switching to markdown we're the formatting of the code snippets on the site. I use the Google Code Prettify to make my code samples look pimpin'. To make your code sample look good, you need to wrap your code samples like this:

Out of the box, the Umbraco conversation tool does not do this and will render any code it finds like this:

In this tutorial, I will show you how to rectify this problem and get Umbraco to automatically render HTML so this works.

The Code

There are a few ways to solve this issue. When I researched the best way of doing this one common way was to use a separate package like MarkdownDeep and then creating a custom formatter just for the code snippet. For my needs to just parsing the content within a text-area, I think the easiest method is to use the HTML Agility pack. HTML Agility Pack is a great tool for easily manipulating HTML. To use HTML Agility pack to inject the tags around any converted code snippets, you could use this snippet:

Here we get the HTML converted from markdown using the normal Umbraco API. This gets passed into the HtmlDocuments LoadHtml() method. From here you can perform a quick search for all code blocks and then updating the HTML as needed. Those four lines of code are pretty much everything you need. If you have your Google Code Prettify configured correctly, it should look something like this:

Google Code Prettify