ieCapture bookmarklet

For those of you who haven’t used Dan Vine’s wonderful ieCapture utility, it is a great way to check how a webpage (presumably one which you are creating) looks on a variety of Windows brosers, including Internet Explorer (4.01, 5.01, 5.5, 6.0), Firefox 0.8 and Opera 7.23. This is especially valuable for a Mac developer like myself who can’t get access to these browsers easily. (Note thta there is a sibling site called iCapture which does the same for the Mac Safari browser).

Because I really enjoy using this tool, I created a quick bookmarklet (see definition of bookmarklet) that will submit the site you are currently viewing to ieCapture and let you view the results in a new window. To use the bookmarklet, simply drag the link below to your bookmarks bar and name it appropriately:

ieCapture bookmarklet

Enjoy.

Feed2JS — Again

Note: In cleaning up the webserver lately, I’ve removed some of the stuff that is linked to here, so you may find it irritating. Sorry about that.

When asked to create a webpage that will be hosted on a rather primitive webserver, I decided to give the Feed2JS tool created by Alan Levine a real-world whirl. The original thought was to use WordPress as the backend, and utilize the per-category feed capability of WordPress to generate content for various sections of the page. While this would undoubtedly be simpler (and faster) if I could just access the wordpress database directly, having the site hosted on a bare-bones server was not negotiable.

Just so you know, I am updating the old iTeacherEd site at the University of Regina, which will be overwritten with the new (development) version fairly shortly.

In order to create a self-updating “recent announcements” section on the front page of the site, I opted to use the proposed WordPress backend. Installing WordPress took all of 5 minutes, and then it was just a matter of creating an “Announcements” category and writing the appropriate posts. You might want to check out the invisible powering blog to see what I mean. The difficulty was that I didn’t want the post to appear in the default manner set by Feed2JS, which automatically links the title of the post to the blog entry and strips out any links within the content of the post. The difficulty I encountered can be seen by looking at:

Original output of Feed2JS

After mucking about with the php code in both Feed2JS and the Magpie engine, I was able to get it to render as I wanted: (this is my hacked version of Feed2JS, created only for this use, and it will not work for much else)

Modified output of Feed2JS

Styling the output with CSS, the recent announcements now appear in the main page seamlessly Nice.

I was originally going to use WordPress to power the hefty number of links that I had to create in the Resources section of the page. However, I discovered that Spurl.net has a Javascript export feature on a per-category basis as well. The two difficulties with using this method is that you cannot have links in the description, and I haven’t found a decent means to order the entries manually (it sorts them automatically with the most recent link being on the top).
You can see this part of the page in action in the resource section.

Lots of work to do yet, but I think it is coming along fairly well.

Redirecting xyz.blogspot.com

After a question was posed to me by Alec Couros, I decided to find out if I could figure out a means of redirecting a site that was formerly hosted on blogspot.com to a new location (presumably where it is now hosted via ftp). The difficulty with this problem is the fact that direct access to the files on blogspot.com is not given. So, the following hack is what I came up with (and it actually works!).

For the following, I created a trial testbed at testredirect.blogspot.com and populated it with a couple of meaningless posts, and I will redirect it to http://www.educationaltechnology.ca/dan/testRedirect/. In order to follow this process, I assume that you already have a pre-existing blog hosted on blogspot.com.

1. Log into your blogger account, and click on the “change settings” button of the blog you would like to have redirected.
2. Click on the “Templates” tab
3. Now comes the work — if this is a template that you have created yourself, you should select the entire template and make a backup (a local file containing the entire contents of the template). It is even easier if it is a pre-made template. The only thing that we need to have in order to allow the redirect to occur is a simple redirecting tag. Therefore, you can leave in as much or as little formatting as you wish (ie. style information, etc.). To keep things simple, I’ll justs get rid of all code but the absolutely necessary stuff. At bare minimum, your template should have this information:

   
   < !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
   	<meta http-equiv="refresh" content="0;URL= http://url.com/path">
   	<title>Redirect Page</title>
   </meta></head>
   	<body>be redirected to the new site, found at
   	<a href="http://url.com/path"> http://url.com/path</a>
   	</body>
   </html>
   
   

   Note that the number 0 (found after the content in the meta tag) dictates the number of seconds until the redirect occurs. If you want the visitor to be able to read the message about the new location of the site, you may want to increase it to 5 seconds or so.

4. the “Save Template Changes” button. After being told that the settings were successfully changed, you will be told you must republish your blog to see the changes. Do NOT republish the whole blog, as this will wipe out any links to posts that people have linked directly to. Note that this will not delete the posts, but simply mess up others links to your previously published posts. Instead, click on the “Republish Index” only link. This will effectively redirect visitors to your main index page, without messing up those who are linking to older posts.
5. Now click on the “Settings” tab, and then the “Publishing” subtab. Click on the Switch to “FTP” link (or SFTP if your host allows it), and fill in the required information for hosting on your server and save the settings, but do NOT republish the blog yet.
6. Click on the “Template” tab, and then either paste in the local copy you have made of your template, or click the “Pick new” subtab and select the template you were using before.
7. Now click on the “Republish” button (republish the entire blog to the new site).
8. Voila. You now have a blogger site that redirects to the new location and preserves the permalinks to previously published articles on blogspot.com. For example, after completing this process with my “testRedirect” blog, the main index at http://testredirect.blogspot.com/ redirects to http://www.educationaltechnology.ca/dan/testRedirect/, but a link to a previous posting, such as http://testredirect.blogspot.com/2004/06/bit-of-greek.html will still be found on testRedirect.blogspot.com (AND on the new site at http://www.educationaltechnology.ca/dan/testRedirect/2004/06/bit-of-greek.html)

Note that there are a few difficulties with this method of redirection, namely that:

• Although this method works just fine in the short term, Blogger *may* have some method of eventually discovering outdated URLs and deleting them from its database, in which case the redirection would cease to work. The other possibility is that some third party might wish to use the blogspot URL that you formerly used, in which case they would overwrite your redirection and have their content at the URL instead. However, I would imagine that this solution would work quite well in most cases, at least in the short term.
• Using the meta tag to redirect is officially depreciated, according to the W3C, so it may not appeal to those who want to follow the strict guidelines. If another way is possible, which doesn’t use the meta tag, I’d be interested to hear about it.

Well, I hope somebody finds that useful. I think it’s a neat way to get away from the ugly ads that appear on blogspot.com, without destroying links to any previous posts. If anyone knows of a better way to do this, please let me know.