Updating Old Posts

Link. September 10, 2008. Comments [0]. Posted in: Blogging

I was recently looking for an old post I had written on some topic and discovered, much to my dismay, that a substantial number of old entries in my weblog were simply unreadable!

Some have code that is very hard to read or poorly formatted, while others force the font color on the main text, overriding the site's CSS styles. A lot of this is stuff that dates before I started using darkish background colors on my weblog theme, and is simply stuff that just wasn't written to be easy to style. Big mistake.

Some other stuff are just entries that I wrote in Microsoft Word and then posted through Windows Live Writer. It seemed like a good idea at the time, but no clue why I ever thought so!

Anyway, I'm slowly going over the old entries and fixing the formatting and making sure everything is readable. If you run into any post with really crappy formatting, let me know and I'll fix it.

Styling Code for Blog (Vim2Css)

Link. August 1, 2008. Comments [1]. Posted in: Blogging | PowerShell | Vim

I've mentioned in the past that I've experimented with a number of different options for styling and syntax highlighting code snippets on this weblog, with varying degrees of success.

For a few months I've been using CSS-based syntax highlighting based on the code generated by Vim's :TOhtml command, and it's been working out pretty well. It means that my RSS feed doesn't have any color, but at least the code itself is correctly formatted.

The part I didn't enjoy too much about :TOhtml, however, was that it would only generate the minimum number of style rules it need to highlight the piece of code it was generating the HTML for. This works fine in many scenarios, but it was annoying for me because it meant I needed to continually update my site code.css file as new rules were generated for new snippets that I didn't have in there before.

So what I really wanted was a way to convert the Vim colorscheme of my choice into a CSS useful for my site. Naturally, I turned to PowerShell and came up with convert-vim2css.ps1:

param( [string] $vimfile )

# some instructions we don't care for
$ignorable = ( 'link', 'clear' )

$nrx = 'hi (?<n>\w+)'
$fgrx = 'guifg=(?<n>#\w+)'
$bgrx = 'guibg=(?<n>#\w+)'
$frx = 'gui=(?<n>\S+)'

(gc $vimfile) | ?{
   ($_ -match $nrx) -and ($ignorable -notcontains $matches.n)
} | %{
   if ( $matches.n -eq 'Normal' ) {
      write '.codebg {'
      write '   border-left: solid 1em #303030;'
      write '   font-size: 1.1em;'
      write '   padding: 0.8em 0.5em;'
   } else {
      write ".$($matches.n) {"
   }
   if ( $_ -match $fgrx ) {
      write "   color: $($matches.n);"
   }
   if ( $_ -match $bgrx ) {
      write "   background: $($matches.n);"
   }
   # element could any combination of these
   if ( $_ -match $frx ) {
      switch ( $matches.n.split(',') ) {
         "italic" { write "   font-style: $_;" }
         "bold" { write "   font-weight: $_;" }
         "underline" { write "   text-decoration: $_;" }
      }
   }
   write '}'
}

# other boilerplate code
write 'code {'
write '   font-family: Consolas, "DejaVu Sans Mono", "Lucida Console", monospace; '
write '}'

It's not very fancy and it only supports GVim schemes, but that's enough for me and does the trick for now.

Formatting Source Code For Blog Posts

Link. February 7, 2008. Comments [4]. Posted in: Blogging | Tools

I've struggled quite a bit over the past few months trying to come up with a good way of including code snippets in my blog posts. The problem, of course, is making the code look good both when browsing the website as well as in the RSS feed. It's not the first time I've ran into this issue, either.

As I've mentioned in the past, one of the things making it hard is my blog engine, as the dasBlog build I'm currently running doesn't properly respect whitespace in the original HTML code. Because of this, posting code is a big pain in the neck, as you need to format the code in HTML manually since using good old <pre><code></code></pre> tags will render the code unreadable in the RSS feed.

Beyond just having the spacing and indentation right, there's also the matter of posting syntax highlighting. There are several options I've tried over the years:

  • CopySourceAsHtml: This is an OK tool, though I've had to build a custom build to make it work on my machine (which has some weird clipboard issues at times; not sure why). I'm not 100% satisfied with it, though. For one thing, it generates pretty ugly HTML. It's also not very useful for posting code in a language not supported by Visual Studio itself, which I occasionally do (example: PowerShell snippets).
  • CodeHTMLer: An online site for converting code snippets to HTML, supporting a bit more languages than CopySourceAsHtml. I've used this one extensively, and it usually does a good job, provided I explicitly check the "convert whitespace" option as well as "Inline Tags" for formatting. You don't get much choice in how the code is formatted, though. I believe there's a Windows Live Writer plugin based on this somewhere, but I always forget where so it's more convenient for me to just use the web application.
  • Syntaxhighlighter: A Javascript Library for formatting code snippets. Looks nifty, but only usable on the website and not RSS feeds, I think. It also seems to rely heavily
  • Iris: This is an interesting project, based on the VIM syntax highlighting. It actually does a pretty good job, though I haven't tried using it yet directly on my blog. The Ajax interface is slick, though there's also a version you can download to use on your own desktop. It only seems to support using CSS for the syntax highlighting, though.
  • TOhtml: I've also been experimenting lately with using Vim's :TOhtml command. This can actually provide very nice HTML if you set up the right options, and given the breath of syntaxes supported by Vim, you can pretty much use it to pretty print almost any code snippet you can think of.
    Another nicety of TOhtml is that it will use the colors in your selected Vim colorcheme, so the generated HTML looks exactly like it does in Vim. It can also generate the formatting using CSS or inline tags.
    As a sample, this is what I used in my last PowerShell post, with the options html_use_css, html_no_pre and use_xhtml. The color scheme I was was using was the black variant of the recently updated moria scheme, aided by Peter Provost's excellent PowerShell syntax files.

I'm sure there are many other options out there. I know there are some very nice plugins for other blogging platforms (like wordpress, from what I've been reading), but for obvious reasons that's not very useful.

Another issue that can be a bit bothersome with code formatting is the choice between using CSS rules or using inline tags.

In an ideal world, using CSS rules would be much more preferred, particularly if you can keep them in an external CSS file. One obvious benefit of this is that if you later decide to change your formatting preferences, your color scheme, or simply change your blog's layout and colors and want your code to match them, it becomes a whole lot easier (though this isn't all that possible for someone like me with 6 years of past blog posts with all kinds of code formatting used).

The downside of using CSS is that it's pretty much a website-only option, so it's not very useful for formatting code in your RSS feed. At least, my experience has been that most RSS generators and/or consumers will strip any inline CSS rules found in blog posts (this was, in fact, what happened to my last PowerShell post mentioned above).

I know of no way to easily reference an external CSS for this, but if anyone knows of a way, I'd sure appreciate knowing about it!

So that pretty much leaves, for now, the only option of not using <pre> tags and resorting to inline tags. Yuck! So, what's the secret sauce others are using for this?

dasBlog, RSS and Whitespace

Link. November 14, 2007. Comments [4]. Posted in: Blogging

Does anyone know why the heck dasBlog insists on screwing up whitespace in a post when generating the RSS Feed? It preserves it correctly when it writes out the feed's HTML, but generates RSS that simply removes it at random places, and it's usually the reason why code samples get screwed up so badly. Is there any workaround for this? Anyone else considers this a problem?

Frankly, I'm starting to seriously consider moving to a new blog engine; though I haven't done any tests to see which one would be a good replacement (any recommendations?). I'm not looking forward to a migration, though, and not sure yet that I can provide a way to keep existing URLs intact...

Yet a New Blog Theme

Link. November 12, 2007. Comments [2]. Posted in: Blogging

I had redesigned my weblog looks back in July, but got bored with it now. It looked fine, but the colors were a bit too strong and the design a bit too complex. I really wanted something a lot more straightforward, that used space more effectively and with softer colors. Here's the result:

Weblog

It's a very simple, minimalist theme, and I'm rather liking it for now. Still some tweaking it a bit, but it seems to do the trick!

Syndicate

About

Tomas Restrepo is a software developer located in Colombia, South America. His interests include .NET, Connected Systems, PowerShell and lately dynamic programming languages. More...

tomasrestrepo @ twitter My Flickr photostream My saved links on delicious My Technorati Profile

email: tomas@winterdom.com
msn: tomasr@passport.com

View my profile on LinkedIn

MVP logo

Ads


Categories

Statistics

Total Posts: 1050
This Year: 1
This Month: 1
This Week: 0
Comments: 825

Archive

Other

Copyright © 2002-2008, Tomas Restrepo.

Powered by: newtelligence dasBlog 2.2.8279.16125

Sign In