As a frequent user of Twitter I noticed a lot of people starting to use the service Ow.ly to shorten their links. As you can see Ow.ly puts a CSS styled frame(not to be confused with old-school HTML frames) at the top of any page you share. Now this concept got me thinking. I share loads of links on Twitter and am essentially promoting someone elses URL shortening service in the process. Ow.ly is getting a visit to their website every time someone clicks on an Ow.ly link, regardless of the destination. Why couldn’t I do that for my blogs?

After doing a little searching I discovered that Pretty Link for WordPress will do exactly what I was looking for. The plugin serves as a URL shortener, but also has a feature that enables you to create a framed version using the “Pretty Bar”. This functionality is pretty much identical to what Ow.ly is doing, only now you can now brand it with your own website.

Now if you install this plugin you’ll notice the the Pretty Bar function isn’t quite as nice as what I’ve got running on my site. That is because I modified the template to the plugin. Now I caution you at this point, if you modify the Pretty Bar template you will need to be careful upgrading to subsequent updates of the plugin, as odds are they will get overwritten. So be careful to backup your changes.

With that said, here is how you modify the template. The Pretty Bar template is located in the Pretty Link plugin folder, handily named prettybar.php. All the CSS and and HTML for the output is located there. I changed quite a bit of the layout and function of the display by messing with things in that file. If you’re handy with CSS/HTML you should be able to easily customize things to your liking.

If you’re not handy with template hacking, there are customization features available under Options > Pretty Bar Options that will allow you to change the colour scheme of the Pretty Bar to match your site.

Once you have it all styled you should be ready to start sharing things. One handy thing that Pretty Link allows you to do is add a javascript link to your quick bookmarks, allowing you to easily create a bookmark. To do this, go to the Pretty Link menu and select tools from within WordPress and follow the instructions. They even give you instructions on how to use Pretty Link from your iPhone, which is neat. Then when you are on a site you’d like to share, simply click the bookmarked link and Pretty Link will spit out a shortened URL like http://www.modsuperstar.ca/dja for you to use on Twitter.

I find when I share my links through Twitter I remove the “www.” from any link I’m sharing. That keeps my links below the 30 character limit Twitter has before it chops down the length of a URL. So far I’m happy with the results, though there are a couple of things I want to figure out going forward. Ideally I want to add links to my most recent posts into the Pretty Bar, but that’s a task for another day.

Edit 1: To get your links to show up with the Pretty Bar by default, under Options > Link Option Defaults change the Default Link Direction Type to Pretty Bar.