Blog Updates Part 2 | March 31, 2004

This site started out as a place to show off the travel pics in my gallery. I installed Movabletype and created my blog design just for a bit of fun. Never thinking people would actually visit my blog, I hid it away in it's own directory, with no way of accessing it from the main site.

As the popularity of my blog increased, I realised I needed to move it to the root of the site, and make the URL's more meaningful at the same time. However, I realised loads of people were linking to pages on this site, so wanted to do it as smoothly as possible. The weekend before last I decided to bite the bullet and make the transfer.

The first step was to change the config so that the siteURL, archiveURL (and their respective paths) pointed to the new locations.

I wanted the date based archives to be of the format

www.andybudd.com/archives/2004/04/

To do this I changed the Monthly archive template to

<$MTArchiveDate format="%Y/%m"$>/index.php

I wanted the individual entries to be in the correct monthly directories and follow the format

www.andybudd.com/archives/2004/04/the_name_of_the_post/

There seemed to be a few ways of doing this, but the simplest way involved making each post an index page in it's own directory.

<$MTArchiveDate format="%Y/%m"$>/<$MTEntryTitle dirify="1"$>/index.php

The category pages were quite simple. They would follow the format

www.andybudd.com/archives/category_name/

and this was accomplished by changing the category archive template to:

<MTCategoryLabel dirify="1">/index.php

This allowed all the pages to be accessed using

www.andybudd.com/archives/2004/04/the_name_of_the_post/

However, they still appeared as

www.andybudd.com/archives/2004/04/ the_name_of_the_post/index.php

on the pages. To rectify this, I used a bit of PHP which I found on Stopdesign.

<a href="<?php echo preg_replace("#index.php$#","","<$MTEntryPermalink$>"); ?>"><$MTArchiveTitle$></a>

Which removes the index.php bit using a regular expression.

I had originally been storing post related images in the old archives folder. However, this didn't seem like a good idea. Instead, I created an images folder in the new archives folder and then I copied all the images to this new folder.

Obviously my posts were still referencing the old images. This was fine for now, as the images were still there. However, I'd want to get rid of them at some stage and clean out my old blog folder, so decided to do a quick url rewrite using a .htaccess file in the old archives folder.

RewriteEngine on RewriteRule (.*)\.gif$ /archives/images/$1\.gif [R=301,L] RewriteRule (.*)\.jpg$ /archives/images/$1\.jpg [R=301,L]

Which simply redirects any image files the corresponding images in the new image directory.

People would still be linking to old posts, so I needed to redirect them to their new locations. As the names had changed as well as the locations, there weren't any clever rewrites I could use. I'd have to list each old file out and then the corresponding new file, as a redirect. Having quite a few posts, writing all the redirects would have taken ages. Luckily I found a few sites that suggested using MT to create the .htaccess file. To do this, I created a new template named htaccess, containing the following code.

<MTEntries sort_order="ascend"> Redirect permanent /blog/archives/<$MTEntryID pad="1"$>.html http://www.andybudd.com/archives/<$MTArchiveDate format="%Y/%m"$>/<$MTEntryTitle dirify="1"$>/ </MTEntries>

Rebuilding this template created a .htaccess file that looked something like this

Redirect permanent /blog/archives/000006.html http://www.andybudd.com/archives/2003/08/city_of_god/ Redirect permanent /blog/archives/000005.html http://www.andybudd.com/archives/2003/08/finally_got_round_to_it/ Redirect permanent /blog/archives/000014.html http://www.andybudd.com/archives/2003/08/skillswap_meeting/ ...

With all the individual entries now being redirected, I had a few more pages, such as my blog index, archive page, links page etc to redirect, and the move was almost complete.

Mostly done now, I just wanted to tie up a quick loose end. With meaningful URL's, people often try to navigate them by "Hacking" the URL. For instance If I see this URL

http://www.andybudd.com/archives/2004/03/from_hero_to_zero/

I may try and backtrack to see where this

http://www.andybudd.com/archives/2004/03/

or this

http://www.andybudd.com/archives/2004/

takes me. The first one works fine, as it take you to the monthly archive index page. However, the latter one just takes you to a directory listing. To avoid this I created a new .htaccess file in the archives directory with the following contents.

RewriteEngine on RewriteRule 200./$ /archives/ [R=301,L]

Which basically redirects any of my yearly folders back to the main archive page, keeping things nice and neat and hackable.

If you were browsing this site the weekend before last, you may have noticed things jumping around a bit. If You've bookmarked any pages on this site, it may be worth updating your bookmarks. I'm pretty sure that all the old pages are redirecting to the new pages, but you can never be 100% sure. If you spot any bugs, or have any suggestions , please let me know.

Posted at March 31, 2004 8:55 AM

Comments

Tomas said on March 31, 2004 10:33 AM

I’ve been thinking about changing my archive paths in that way, too. For quite a while, actually, but I can’t bring myself to actually do it.

Using MT to create a .htaccess file with redirects is pretty clever, I’d have just made a PHP script which looks up the proper URL, given a six digit number (the MT post id), and have a .htaccess file serve any of the “old” permalinks that PHP script.

I can’t quite decide if I prefer the permalinks to end with a slash (i.e. be a directory), or not, though (like Mark Pilgrim does them). Using PHP to “fix” the URL (to remove “index.php”) seems like a bit of a hack, and it’s not always possible, if the output is from a CGI-script, for instance.

Andy Budd said on March 31, 2004 12:03 PM

You could use the Regex plugin from Brad Choate instead of PHP. I agree that it is a bit of a hack using PHP, but I really like the way it all works out.

Cameron said on March 31, 2004 4:44 PM

Andy, love the blog tips, very helpful… but could you consider increasing the size of the code copy? I can barely read it. (Is it just me, or same size for anyone else?)

Andy Budd said on March 31, 2004 6:42 PM

Hi Cameron,

The size of the example copy has been bugging me for a while as well. Not exactly sure why it’s haappening, but on some browsers (including Safari) the text comes out really small, despite the fact that I’m not doing anything with the font size.

Seth said on March 31, 2004 8:34 PM

just an fyi - this entry breaks your design in IE. Looks like one of the code snippets is forcing the width to expand, pushing your right-hand column below the entries.

Hasan said on April 1, 2004 2:57 AM

Andy, re: .example font-size…

Is it because font-family “monospace” is inheriting a 70% font-size from the body tag? Adding a font-size property to the class “example” solves it, even if it’s as little as .example {font-size: 1.1em;}.

Cameron Moll said on April 1, 2004 5:41 AM

More info about the code font size: in Safari and Win and Mac Firefox, it’s really tiny. In Win IE, it’s roughly the same size as the rest of the copy (looks fine).

Jon HIcks said on April 8, 2004 8:42 PM

Andy - thanks a lot for detailing the process. I’ve been thinking about doing this for a while, and a walkthrough like this is just what I needed.