Color-Coded Source code in blogs


Someone recently asked me how I do the color coding of source code in my blog.  Well, it is really very simple.  I do my work in VS 2005 Express and then cut and paste it into word (an email actually), then cut and paste that into a blog entry… and presto… nicely formatted, color source code to blog about….   Enjoy!

 

    class Program

    {

        static void Main(string[] args)

        {

            Console.ForegroundColor = ConsoleColor.Red;

            Console.WriteLine(“Hello World!”);

        }

    }

 

   

Comments (34)

  1. I’ll admit that it was me who asked, and I’m embarassed to say that I never thought of trying something so simple. I wrote a whole client to call the ShowCode Web Service (http://tripleasp.net/Services/ShowCode.asmx), but I had issues with the formatting when I tried to post it to .Text. Brad’s method works perfectly, and I thank him for the tip. Genius!

  2. Jeff Atwood says:

    Your example completes me.

  3. Your code shows up nicely color-coded in the browser, but not in SharpReader. SharpReader displays your code in the same format as your normal text. Didn’t know if you knew that or not.

  4. I use a tool called Get Colouring!. It generates the html body from a source file and knows about several different languages. Takes a bit longer but I think it looks really nice. See: http://www.xavierpacheco.com/xlog for an example.

  5. Hey,

    what a coincidence. I have just recently released a free utility called Colorizer that does full parsing and coloring of C# code, spitting out HTML perfect for blog entries, including collapsing/expanding of #region blocks.

    I wrote a short article on how it was done with a demo and a free download.

    For those interested: http://drazen.dotlic.name/weblog/articles/182.aspx

  6. Mike Parsons says:

    Hey Brad,

    Here is a VS.Net Macro that I use … just select the code and run the macro

    Sub FormatSourceCode()

    Dim oOLEObject As Type

    Dim oWord As Object

    ‘Create a Temp File

    Dim TempFile As String = Environment.GetEnvironmentVariable("TEMP") & "" & System.Guid.NewGuid.ToString & ".htm"

    ‘Get the Selected Code

    Dim selection As TextSelection = DTE.ActiveDocument.Selection()

    ‘Nothing selected

    If selection.Text = "" Then

    MsgBox("No Code Selected!")

    Exit Sub

    End If

    ‘Copy the selected code to clipboard

    selection.Copy()

    ‘Instantiate Word to Achieve HTML Code Formatting

    oOLEObject = Type.GetTypeFromProgID("Word.Document")

    oWord = Activator.CreateInstance(oOLEObject)

    oWord.ActiveWindow.Selection.PasteAndFormat(0)

    ‘oWord.ActiveWindow.Selection.WholeStory()

    ‘oWord.ActiveWindow.Selection.Copy()

    oWord.SaveAs(TempFile, 8)

    oWord.Close()

    oWord = Nothing

    oOLEObject = Nothing

    ‘Get the Formatted HTML Code From Temp Word File

    Dim oFile As New System.IO.FileInfo(TempFile)

    Dim oFileStream As New System.IO.FileStream(TempFile, IO.FileMode.Open, IO.FileAccess.Read)

    Dim oStream As New System.IO.StreamReader(oFileStream)

    Dim szContent As String = oStream.ReadToEnd()

    ‘Add our custom comment stuff here

    szContent = szContent.Replace("<body ", "<body nowrap ")

    oStream.Close()

    oFileStream.Close()

    ‘View The HTML File

    System.Diagnostics.Process.Start(TempFile)

    ‘Nuke the Temp file

    ‘oFile.Delete()

    End Sub

    End Module

  7. Jose Luis Manners says:

    Brad,

    I do exactly the same thing you do except that I always add a gray background before pasting the code into my blog, like in this post:

    http://blogs.geekdojo.net/jmanners/archive/2004/09/27/3226.aspx

    You can do this directly in Word by selecting Format–>Borders and Shading–>Shading (tab). I normally pick the third gray shade from left to right. But I love macros so I think I gonna try Mike Parsons’ solution as well.

  8. I’m partial to <a target="_new" href="http://www.manoli.net/csharpformat/">http://www.manoli.net/csharpformat/</a&gt;.
    <br>
    <br>The WORD technique produces ugly and often non-compliant HTML. The manoli site produces clean html and CSS… In fact, it provides a separate CSS file so you don’t have to include the inline CSS.

  9. haacked says:

    I never liked the HTML output from MS Word. So I typically use http://www.manoli.net/csharpformat/ which produces HTML and CSS.

    It even provides a CSS file if you don’t want inline CSS everytime you post code.

  10. Cory Smith says:

    I really liked the idea of having a macro within VS.NET… however, wasn’t happy with the implementation and final HTML result. I’ve seriously tweaked the above macro and now it’s a one step process. You select the code and press the macro button (if you set one up)… then switch to your blog tool and paste.

    You can find the code at http://www.addressof.com.

  11. Sean Chase says:

    That’s great! I usually get my code from VS.NET 2003 and what I do is past into MS Word, then copy from Word and paste into FrontPage 2003, use the "Apply XML Formatting Rules" command in FrontPage, then paste the resulting HTML into the .Text editor in HTML view. L-A-M-E…but it works. :-)

  12. Johann Gerell says:

    When I run that macro in VS.Net 2003, I get an error:

    Public member ‘PasteAndFormat’ on type ‘Selection’ not found.

    Any ideas why?

  13. Jasper22 says:

    I use http://www.manoli.net/csharpformat/ with taged CSS if I want it colored

  14. <p>
    <a href="http://blogs.msdn.com/brada/archive/2004/10/05/238427.aspx">Brad Abrams</a>,
    <a href="http://blogs.msdn.com/jaybaz_ms/archive/2004/03/30/103505.aspx">Jay Bazuzi</a>,
    <a href="http://weblogs.asp.net/rosherove/archive/2004/02/05/67957.aspx">Roy Osherove</a>,
    and what seems like the majority of .NET bloggers use Word, Word macros, or Visual Studio macros that use Word
    in some way to format their code. A few use
    <a href="http://www.manoli.net/">Jean-Claude Manoli</a>’s
    <a href="http://www.manoli.net/csharpformat/">CSharpFormat</a&gt;
    tool. Each solution has drawbacks (opening Word, opening another browser window, copying and pasting, extra steps,
    terrible HTML, etc) and formatting code is still painful. So…
    </p>
    <p>
    I’ve written a simple Visual Studio add-in that allows you to copy source as HTML suitable for pasting into blogs…
    </p>

  15. Brad Abrams, Jay Bazuzi, Roy Osherove, and what seems like the majority of .NET bloggers use Word, Word macros, or Visual Studio macros that use Word in some way to format their code. A few use Jean-Claude Manoli’s CSharpFormat…

  16. Wes says:

    Check out PostXING (http://markitup.aspxconnection.com/Projects/Project.aspx?projectId=12) it s a simple free blogging tool that has a built in syntax highlighter that works pretty well. I’m acutally working on a more customizable version of this syntax highlighter (to be released soon I hope).

  17. Brad Abrams, Jay Bazuzi, Roy Osherove, and what seems like the majority of .NET bloggers use Word, Word macros, or Visual Studio macros that use Word in some way to format their code. A few use Jean-Claude Manoli’s CSharpFormat…

  18. Keith's Blog says:

    Well I guess this will be the first thing to sort out. Looks like Brad Abrams has some answers:http://blogs.msdn.com/brada/archive/2004/10/05/238427.aspx

  19. Brad Abrams pointed out that he uses copy and paste into Word from Visual Studio 2005 Express Edition.

  20. Here are some tools to use for formatting code for the ol&#8217; blog. You can thank your favorite CodeMonkey

  21. It is painful to post code to your blog without any special considerations. In the worst case you have

  22. Palermo4 says:

    I just posted a blog, and spent too much time trying to get my code to format correctly. At that, it