share
Stack OverflowWhat is best blogging host for programmers/code formatting?
[+68] [22] CodingWithoutComments
[2008-08-12 17:02:24]
[ wordpress formatting syntax-highlighting blogs ]
[ http://stackoverflow.com/questions/9051/what-is-best-blogging-host-for-programmers-code-formatting ] [DELETED]

I was just reading how can you tell whether you're ready to start your own blog. The answers are so good and inspiring that I made rush to start my own blog using blogger [1] and stopped right in my tracks. I looked on the menu bar as I was creating my first post, and duh, there's no nice "code sample" formatting option like the one on Stackoverflow.

Does this exist on any of the standard blogging options (blogger/wordpress/livejournal) or is this something I'm going to have to code up myself?

Edit: Using the knowledge I have garnered from this post, I have started a blog using Wordpress [2] entitled //Coding Without Comments [3]. My first post states my reasons for starting a blog, experience in working with wordpress, and summarizes the best Code Formatting options. I will continue to update my post as more answers come in.

Nice new blog - you've been busy. I'll admit, several of your posts went right over my head, but it's definitely providing me with some motivation. - 81bronco
Hah. Thanks man. I've slowed my pace a bit these days. - CodingWithoutComments
[+45] [2008-08-12 17:10:55] Yaakov Ellis [ACCEPTED]

To the best of my knowledge, none of the mainstream blogging services have this built in. It is a function of design and template. I would go with Wordpress [1] because it is the best. For code formatting:

  1. Design your own styles and functionality if you are up to the challenge
  2. Check out the SyntaxHighlighter [2] JavaScript project (used by Hanselman [3]). You should be able to integrate this pretty easily into any blogging system. (See my blog post [4] on integrating this with WordPress).
  3. Use Windows Live Writer [5] with the Insert Code [6] plugin (this will automatically format the code that you paste in properly and post it right to your blog. See here for an example).

Note: If you want to have the most flexibility for constructing your blog template and functionality as you want it to be, you would need to use Self-hosted WordPress.org [7], not the hosted WordPress.com [8].

[1] http://Wordpress.org
[2] http://code.google.com/p/syntaxhighlighter/
[3] http://www.hanselman.com/blog/TheWeeklySourceCode24ExtensibilityEditionPlugInsProvidersAttributesAddInsAndModulesInNET.aspx
[4] http://ellisweb.net/2008/08/using-syntaxhighlighter-to-format-code-in-wordpress/
[5] http://windowslivewriter.spaces.live.com/
[6] http://gallery.live.com/liveItemDetail.aspx?li=1f57bd9b-a692-4593-9e9e-e2962d9c0eee&bt=9&pl=8
[7] http://WordPress.org
[8] http://WordPress.com

(3) +1 for WordPress, especially since Wordpress.com has the SyntaxHighlighter plugin. Now you just need to wrap your code in [sourcecode] tags - Thomas Levesque
@Thomas actually this 'just need to wrap' causes lots of issues with TinyMCE's auto html formatting. - Poma
Windows Live Writer also has 'Paste from Visual Studio' plugin that just pastes your code exatly as it is formatted in VS - Poma
Well, I am quite late to the party, but I have found that Colorer works really well for making paste-able syntax highlighted code, although it's language recognition leaves much to be desired. A minor caveat IMO. - Srijan
1
[+16] [2008-08-12 18:24:02] CodingWithoutComments

I was just looking at the Wordpress Plugins [1] and came across the WP-Syntax plugin [2].

WP-Syntax provides clean syntax highlighting using GeSHi -- supporting a wide range of popular languages. It supports highlighting with or without line numbers and maintains formatting while copying snippets of code from the browser.

[1] http://wordpress.org/extend/plugins/
[2] http://wordpress.org/extend/plugins/wp-syntax/

2
[+11] [2008-08-12 17:40:26] Lance Fisher

In my opinion, Blogger is the best hosted blog solution. It's free, you can have your own domain name, and you can totally customize the template. I'd check out the SytaxHighlighter like several other people here have mentioned. If you need a place to host js and other files, get an Amazon S3 [1] account, and use the S3 Organizer FireFox plugin [2].

Steer clear of hosted Wordpress. It is terrible. You cannot customize anything without paying for it.

One more thing that not many people pay attention to: If you want to have the best template to show code, I'd find one with a liquid layout. That way your code "box" can grow larger when the reader resizes their browser.

[1] http://aws.amazon.com/s3
[2] https://addons.mozilla.org/en-US/firefox/addon/3247

(comment added as a bookmark) +1 - toolkit
+1 I was researching this today and came to the same conclusion. - cletus
3
[+10] [2011-07-23 03:24:10] m42

Thomas Levesque hinted at the answer in his comment on the "correct answer", but it wasn't really clear.

Maybe this will help others:

The following works perfectly in WordPress on a free blog with no plugins, scripts, or hassle.

[code lang="vbnet"]

    Dim things As New List(Of Thing)

[/code]

Alternately, this also works:

[sourcecode language="vbnet"]

   Dim things As New List(Of Thing)

[/sourcecode]        

(1) This answer really needs more upvotes. Official documentation is here: en.support.wordpress.com/code/posting-source-code - Dan Ling
4
[+8] [2008-08-12 17:52:32] Christian Lescuyer

I suppose you're a programmer if you're lurking here :-) Then I would advise to host Wordpress (or any other blog software) yourself. Not at home, mind you, but on any of the cheap hosting companies around. I won't recommend mine as it's in France, a bit too far away.

There are two main reasons:

  • You will be the master of your domain name: when you want to change hosting company or software, you will be able to do so. You don't want to change your domain name when you have thousands of readers and a Google PageRank of 5.
  • You will be able to customize your software (with little effort) to add the many plugins available.

A few links on the subject:

Cheers

[1] http://www.problogger.net/archives/2006/02/15/choosing-a-blog-platform/
[2] http://www.problogger.net/archives/2008/05/11/migrating-your-blog-between-platforms-pitfalls-and-consequences/
[3] http://blogging.typepad.com/how_to_blog/2006/02/starting_a_new_.html

5
[+4] [2008-08-13 03:58:55] grom

You can convert the code into html with syntax highlighting before posting it to your blog. For example in vim you can use the :TOhtml [1] command.

Also you can use GeSHi [2] . The WordPress plugin WP-Syntax [3] uses GeSHi, but you can also use GeSHi offline.

[1] http://tips.webdesign10.com/how-to-convert-code-to-html-with-vim
[2] http://qbnz.com/highlighter/
[3] http://wordpress.org/extend/plugins/wp-syntax/

In Emacs you can use M-x htmlfontify-buffer to achieve the same effect. It uses your Emacs color scheme by default, but should be easy to customize because it uses css for the actual styling. - Tikhon Jelvis
6
[+3] [2008-08-17 05:03:33] Dan Herbert

As a few people have already mentioned, I use SyntaxHighlighter [1] on my blog. The only issue I had with it is that my markup wouldn't be valid if I followed the instructions from the SyntaxHighlighter usage wiki. To fix this problem I added some simple jQuery code before SyntaxHighlighter scans my document:

$(document).ready(function() {
    $('pre.code').attr('name', 'code').removeClass('code');
    dp.SyntaxHighlighter.ClipboardSwf = 'clipboard.swf URL';
    dp.SyntaxHighlighter.HighlightAll('code');
});

Instead of adding the name="code" attribute to my <pre/> tags, I add a 'code' class to my pre tags before I add my language attribute so my class attribute looks like this:

 <pre class="code css">

 </pre>

And my javascript code adds the 'name' attribute and removes the 'code' class dynamically so that my markup validates and works flawlessly with SyntaxHighlighter.

[1] http://code.google.com/p/syntaxhighlighter/

7
[+2] [2008-08-12 17:24:19] Adam Tuttle

Mango Blog [1] and BlogCFC [2] both support code blocks out of the box, using the code tag:

<code></code>

Both are CFML applications, so you'll either have to get some ColdFusion hosting, or run one of the open source alternative engines: Railo [3], OpenBD [4], (and it's there, but probably not full-featured enough to run these apps: The Smith Project [5])

[1] http://mangoblog.org/
[2] http://blogcfc.com/
[3] http://www.railo-technologies.com/en/index.cfm
[4] http://openbluedragon.org/
[5] http://smithproject.org/

8
[+1] [2008-08-12 18:40:21] Alvin Ashcraft

I use and recommend WordPress. You can start off with a hosted WordPress blog and move it off to another hosting provider if you want to take advantage of the great number of plug-ins available. With a hosted blog, you can only use the plug-ins that WordPress makes available to you.

...and use Windows Live Writer for writing/publishing. There are several nice code formatting plug-ins available for WLW.


9
[+1] [2008-09-16 02:36:57] Ryan Stille

I use WordPress with the "Code Markup" plugin. It has worked really well. You just surround the code in your posts with

<pre><code>code here</code></pre>


10
[+1] [2010-11-12 18:47:00] Elmo Gallen

How about BlogTrog [1] Code Window?

[1] http://www.blogtrog.com

11
[+1] [2011-02-28 22:04:02] MikeKusold

I use Gist [1] on my wordpress site. I tried the other Syntax highlighting plugins, but they never quite worked as well as I wanted.

[1] https://gist.github.com/

12
[0] [2008-08-12 17:10:58] GaryF

It doesn't exist as standard, being somewhat niche, but there are plenty of nice scripts out there to help format. The best one I've seen (which is what Yahoo! use on their YUI pages) is SyntaxHighlighter [1].

Of course, given how nice the Stack Overflow boxes are for doing code, you might want to look at how they do things and "port" it to Blogger ;)

[1] http://code.google.com/p/syntaxhighlighter/

13
[0] [2008-08-12 17:17:58] Rob Cooper

I second Yaakov Ellis [1] - I personally use Windows Live Writer and Insert Code.

[1] http://stackoverflow.com/questions/9051/what-is-best-blogging-host-for-programmerscode-formatting#9057

14
[0] [2008-08-12 22:30:23] icco

I really got into PHP programming thanks to Wordpress and would recommend it in a heartbeat. Active developer community, plugins and tutorials galore and it's a cinch to install.


15
[0] [2008-08-12 23:14:57] eviljack

copy and paste into word from visual studio. Then from word, copy and paste into your blog.


16
[0] [2008-08-13 04:20:08] guitsaru

I use Chyrp [1] because it's lightweight and easy to use. For code formatting you can use the Geshify [2] module or my own code feather [3].

[1] http://chyrp.net
[2] http://chyrp.net/extend/view/63
[3] http://chyrp.net/extend/view/79

17
[0] [2008-08-13 22:43:42] CodingWithoutComments

CodeHTMLer [1] is a simple program that translates plain text code into a colorized HTML version of the code.

[1] http://puzzleware.net/codehtmler/default.aspx

18
[0] [2008-08-16 12:56:30] CodingWithoutComments

If you use TextMate in Mac OSX, BitButter has a great post [1] on how to display your TextMate code (formatting included) in WordPress.

[1] http://www.bitbutter.com/displaying-textmate-code-in-your-wordpress-blog/13

19
[0] [2008-08-17 04:40:11] CodingWithoutComments

Code Markup [1] is another Wordpress Plugin.

[1] http://www.thunderguy.com/semicolon/wordpress/code-markup-wordpress-plugin/

20
[0] [2008-09-15 15:41:46] Geof Harries

Squarespace [1] has a really nice admin interface, the best in the industry as far as I am concerned.

[1] http://www.squarespace.com/

21
[0] [2011-07-24 17:37:36] andho

I just want to add CodeColorer [1] plugin for wordpress. It works really well. It has an option for escaping html entities and supports a lot of languages. Check you can see it in action on this post [2]

[1] http://wordpress.org/extend/plugins/codecolorer/
[2] http://blog.andho.com/2011/07/20/modifying-private-or-protected-properties-in-php/

22