nuzzaci - an online journal

Background, similar to wikipedia.org, I have a small icon next to all links that will take you away from this site. Up until now I’ve been using a javascript function that I wrote and posted back in December 2006 to find all external links and add the icon. It’s quite a flaky and… ugly script, so I though it would be a good idea to revisit the issue and give it another go.

Thoughts, first I though I would just use the brilliant jQuery javascript library and turn my 10+ lines into 4. This might be a method many would recommend and suggest, but similar to when I approached the “Flickr images are a bit to wide” issue with the nuzzaci Width Watchers plugin, I thought — why not do it server side?

Solution, So, let me present the nuzzaci External Links wordpress plugin. It fairly straight forward.

This plugin will look through your posts before they get displayed and either modify the existing class attribute or create a class attribute with the value external to all links that don’t link within the current domain name. It will ignore all links without http:// and all links where the node is an image. This plugin doesn’t touch the database.

View the script here, and download it here
(the 4 line javascript solution using jQuery can be found here).

Instructions, Download the file, upload it to your plugin folder, log on to your admin section and activate it. Before you see any visual difference on the external links you’ll need to define how you want the class ‘external’ to look like. Here’s an example how you get all external links to look like wikipedia’s external links.

I’m using wordpress 2.0.5, but don’t see why this plugin shouldn’t work on all versions.

Background, Mr Cookie at made-in-england.org asked me if I knew of a way to change the size of the images published to his blog via Flickr. It’s not a case of Mr Cookie being lazy or not capable of resizing images — he’s on holiday and are sending photos directly from his phone to his Flickr account, that then in return post the photo to his blog.

When setting up your blog on Flickr you can select from three sizes; 500, 240 and 100 pixel wide. Most people, like Mr Cookie, find that 500 pixels is a bit to wide. A 500 pixel wide post area forces the lines to run long and extends the recommended 66 characters / 10 words per line (unless, of cause, if you set a really large font-size). 240 pixels and 100 pixels are normally a bit too small if it is a main post image.

Thoughts, The quick fix on Mr Cookie’s blog was a CSS workaround; added a max-width to all the images within the a post — .postclass img{max-width:460px}. But IE 6 and older browsers don’t support max-width.

My next thought was to write a javascript function. But I’m no big fan of the onload flickering behaviour. A webpage need to be fully loaded before any javascript kicks in, so everything done with javascript that changes the look of the site will be noticeable for the trained eye. An example on this is my external link script. Even if there may be ways around the flickering onload behavior, it didn’t feel like the right job for Mr javascript.

Solution, So, let me present the nuzzaci Width Watcher wordpress plugin. It fairly straight forward.

This plugin will look through your posts before they get displayed and make sure that no images are wider than a desired maximum width (specify desired width in the nuzzaciWidthWatcher.php file). If an image is too wide, the plugin will add a height and width attribute to the image so that it will be displayed with the desired width while still keeping the correct ratio. It will ignore all images that already have a width or height attribute and/or if the size is less than the set maximum width. This plugin doesn’t touch the original image or the database.

View the script here, and download it here.

Instructions, Download the file, edit the max width variable, upload it to your plugin folder, log on to your admin section and activate it.

I’m using wordpress 2.0.5 and I have tried it on v2.2, but don’t see why this one shouldn’t work on all versions.