Thursday, March 31, 2011

What's the best way to add colored-sytax code snippets to a web page?

Is there a web gadget or service or some open source solution for doing this?

Or do people just hand-code this in the HTML?

I need to add some Ruby and Python code to a web page.

From stackoverflow
  • I think Stack Overflow uses this or something very much like it: http://code.google.com/p/syntaxhighlighter/

  • If you're using the Vim editor, its pretty simple. Just open the code in a GVIM window and save it as an HTML file (Save As.., etc).. it will do all the work for you creating an HTML file that preserves syntax highlighting.

    EDIT: Its actually "Convert to HTML" on the Syntax menu. (http://vim.wikia.com/wiki/Pasting_code_with_syntax_coloring_in_emails)

  • SyntaxHighlighter 2.0 was recently released here is a basic snippit to get you started:

    <head>
        <script type="text/javascript" src="path/to/scripts/shCore.js"></script>
        <script type="text/javascript" src="path/to/scripts/shBrushPython.js"></script>
        <script type="text/javascript" src="path/to/scripts/shBrushRuby.js"></script>
        <link type="text/css" rel="stylesheet" href="path/to/css/shCore.css"/>
        <link type="text/css" rel="stylesheet" href="path/to/css/shThemeDefault.css"/>
        <script type="text/javascript">
         SyntaxHighlighter.config.clipboardSwf = 'path/to/scripts/clipboard.swf';
         SyntaxHighlighter.all();
        </script>
    </head>
    
    
    <pre class="brush: python;">
        ... code ...
    </pre>
    
    <pre class="brush: ruby;">
        ... code ...
    </pre>
    
  • I think this site uses prettify.

  • I think you're looking for something like GeSHi - The generic syntax highlighter. I've had a lot of success with this in the past, GeSHi supports a TON of languages. Not only is this useful for your own syntax highlighting on your web site, but I use the source files because they contain all of the language keywords (I need them for a text-editor I'm working on with syntax highlighting). It's been a godsend.

    If you specifically need just Ruby and Python highlighting, you may want to check out NetBeans. It has a feature to output your source code to an HTML page while keeping all of the coloured syntax.

    Bryan Locke : Cool. Didn't know NetBeans had that. That's perfect. Thanks.

0 comments:

Post a Comment