Archive for blogging

Code Snippets in Windows Live Writer

I was asked how I insert code snippets with Windows Live Writer. I actually did it the hard way. I wrote a Windows Live Writer plug-in, and then I found out someone had already done the same thing.

I originally got scared away from it because when I switch to the HTML view in Live Writer, it shows up like this:

<div class="wlWriterEditableSmartContent" id="scid:812469c5-0cb0-4c63-8c15-c81123a09de7:19d17d14-ac74-45e7-9276-5c6a3031b09d" style="padding-right: 0px; display: inline; padding-left: 0px; float: none; padding-bottom: 0px; margin: 0px; padding-top: 0px"><DIV class=dp-highlighter>
<DIV class=bar>
<DIV class=tools><A onclick="dp.sh.Toolbar.Command('ViewSource',this);return false;" href="about:blank#">view plain</A><A onclick="dp.sh.Toolbar.Command('CopyToClipboard',this);return false;" href="about:blank#">copy to clipboard</A><A onclick="dp.sh.Toolbar.Command('PrintSource',this);return false;" href="about:blank#">print</A><A onclick="dp.sh.Toolbar.Command('About',this);return false;" href="about:blank#">?</A></DIV></DIV>
<OL class=dp-xml>
<LI class=alt><SPAN><SPAN>test&nbsp;&nbsp;</SPAN></SPAN></LI></OL></DIV><PRE class=xml style="DISPLAY: none" name="code">test</PRE>

That is just unacceptable. Fortunately, I realized that it just renders that temporarily, so that you can see a better preview of what it will actually look like on your site.

When you post it, it still has the annoying div above the pre, but I can live with that. All of the other added tags are not there, and you just get your code wrapped in a nice pre. I’m assuming it’s there so that it recognizes that as a code block if you want to edit it later.

I like the SyntaxHighlighter code because it uses JavaScript to parse apart the code and add in the appropriate styles. It’s a nice separation between content and presentation.

I do recommend that if you use the SyntaxHighlighter, that you combine the JavaScript files into one, and then run it through a JavaScript compressor. That will minimize file sizes and page requests.

For example, in this blog, I simply include this in each page:

<link href='http://www.young-technologies.com/sh/SyntaxHighlighter.css' rel='stylesheet' type='text/css'/>
<script src='http://www.young-technologies.com/sh/sh.js' type='text/javascript'></script>

Before the body tag, I then use this code:

<script type='text/javascript'>
	dp.SyntaxHighlighter.ClipboardSwf = 'http://www.young-technologies.com/sh/clipboard.swf';
	dp.SyntaxHighlighter.HighlightAll('code');
</script>

This has been working great on my site. Hope that helps you out!

Subtext blog platform feature requests

For this blog, I’m currently using WordPress. For my personal blog, I chose to use SubText. SubText is an ASP.NET based installable blogging platform that was originally based on the .Text source code. I initially tried to stay with a .NET based solution, so that I would be able to fix it if something went wrong.

It’s a great platform, and I have few complaints. It’s simple, and it does its job extremely well. I do however, have some suggestions (if they’re not already in there).

image

Output Caching - For low traffic sites, this doesn’t really make a difference. What I am concerned with is the chance that my site could end up on the front page of Slashdot or Digg. The only hope of survival is output caching. Even caching for 30 seconds could make a huge difference.

As an extra bonus, a SQL dependency cache could be used so that changes still show up immediately.

Meta Description - The keywords are not very important, but it would be nice to have a nice meta description. Google usually DOES use the meta description tag if you supply one.The all-in-one seo pack for Wordpress works pretty slick, because it gives you a place to change all of your SEO settings.

301 Redirects for non-standard URL’s - Many of the search spiders are not very intelligent. It would be nice if the URL’s were forced to be a certain pattern. For example, if someone links to superjason.com instead of www.superjason.com, it doesn’t get redirected. That means that the search engines will potentially index both. The same goes for the capitalization of the post names. I would like it to redirect to the all lower case version of the URL’s.

NoFollow, NoIndex - It would be nice if a lot of the architecture pages (categories, archives, tags), were marked as NoIndex. It would also be nice if links to those pages were marked as NoFollow for safety. There’s no reason to pass on your PageRank to pages without any unique content. There is also no reason for them to show up in the search engines.

HTML Cleanup - This feature is much less important to me. It would be neat to use HTML Tidy to clean up the HTML if it’s malformed. I used to write my post HTML by hand until Windows Live Writer matured.

I do, however, have lots of old posts that have potentially malformed HTML. My plan is to eventually write a utility that will clean them up.

I’ve been seriously contemplating converting it to Wordpress. It’s nice being on one of the most popular platform. The fact that I can use add-ons to make it exactly what I want is certainly a plus.

Let’s see what you can do Subtext!

Converted my blog from Blogger to Wordpress

Well I did it. I actually really liked using Blogger, and I had finally gotten my blog set up the way I liked. However, I just wanted a little more. I evaluated a couple of different solutions (including Subtext, which I use on my personal blog), and I decided to go with WordPress (the software, not the hosted service).

WordPress Logo

First off, I wanted to be able to have a little more control over some SEO aspects of my blog, such as using a robots.txt. The all in one SEO pack Wordpress plug-in seems to handle many of my requirements. Unlike Blogger, a lot of the non-content pages won’t get indexed now (a good thing). See “Avoiding duplicate content with your site” for more information.

I also wanted to use the Apache mod_rewrite functionality, which is really an amazing tool. For example, I’m doing 301 redirects on all of the old Blogger archive pages, to the equivalent Wordpress archive URL’s.

RewriteRule ^([\d]{4})_([\d]{2})_[\d]{2}_archive.html$ /$1/$2 [R=301,L]

I also set up the Google Analtyics Plugin, which sets up some pretty neat tracking features. It’s even supposed to track outgoing links, but it isn’t working for me for some reason. I’ll be checking with the author.

Overall, I’m very happy with the Wordpress platform. It’s very simple and simply works like I would expect. Since it’s one of the most popular blogging platforms, I know that support is just a Google away, and bugs shouldn’t stay around too long. I also know that I can easily extend its functionality, or at least add content.

I’m hosting it on my dedicated server under Xampp. Installation of Apache, MySql, and Wordpress couldn’t be easier. In fact, I had it up and running in about 10 minutes. The performance seems pretty good compared to Blogger. There are a lot less files being downloaded, which should really help. I also plan to enable gzip compression for some more speed, and I would like to get a caching plugin to avoid constant page regeneration.

Let me know what you think of the new site, and my new theme!

PS. Sorry to my RSS subscribers. When I switched to Wordpress, the RSS feed shows the posts as all being new.

Adding social tech site buttons to Blogger

ObiShawn asked me how I added the buttons at the end of each post for the social tech sites. You can look at the end of this post to see what I mean.

It’s simple!

Edit the HTML for your template (Layout -> Edit HTML), click on "Expand Widget Templates". Look for this code:

<p><data:post.body/></p>

Immediately after that code, add this:

<p><a expr:href='&quot;http://www.dotnetkicks.com/submit/?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' expr:id='data:widget.instanceId + &quot;_kickit&quot;' rel='nofollow'><img alt='Submit this story to DotNetKicks' expr:src='&quot;http://www.dotnetkicks.com/Services/Images/KickItImageGenerator.ashx?url=&quot; + data:post.url'/></a>
<br/>
<script type='text/javascript'>
var dzone_url = &#39;<data:post.url/>&#39;;
var dzone_title = &#39;<data:post.title/>&#39;;
var dzone_style = &#39;2&#39;;
</script>
<script defer='defer' src='http://widgets.dzone.com/widgets/zoneit.js' type='text/javascript'> </script>
<br/>
<script type='text/javascript'>
digg_url = &quot;<data:post.url/>&quot;;
digg_title = &quot;<data:post.title/>&quot;;
digg_skin = &quot;compact&quot;;
</script>
<script defer='defer' src='http://digg.com/tools/diggthis.js' type='text/javascript'/>
</p>

That’s the exact code I’m using in my template at the time of this post. It’s not visually perfect, but it works.

Ask me questions, I might just answer!

On the right side of my blog, you’ll notice that I added a question button. If you have a question that is technology or software related, please ask! If your question is stupid, I admit, I will probably ignore it. However, if you have a good question, I’ll try my best to answer it with its very own blog post.

iStock_000005196844XSmall

A former co-worker of mine mentioned that he doesn’t have a contact page because he’s afraid of the questions he’ll get. I know exactly where he’s coming from. I’m hoping that every once and a while there will be a jewel in there and we can both benefit. Of course if I choose your question you’ll get a link from this blog, and all the fame and fortune that comes with it.

On a side note, I got the cool looking dialog below when I went to delete the question mark image off my computer. I think Windows would be a lot cooler if they bought some images off of iStockPhoto.

Delete File Dialog