javascript

You should check out "Use the Best Available Ampersand" from SimpleBits. I love me some ampersands, and that post is a great resource for prettifying your site's ampersands with a little CSS typography.

Along the lines of last week's jQuery "widon't" post, you can offload some of the typography processing to the browser. It's really slick and simple if you have jQuery enabled.

To use some of his ampersandy style goodness, add this JavaScript snippet to your site somewhere:

jQuery(function($){
 
$('h1,h2,h3,h4,h5,h6').each(
    function(){
        $(this).html($(this).html().replace(/&amp;/g,'<span class="amp">&amp;<\/span>'));
    }
);
 
});

Then simply add a few CSS font style rules to your site's stylesheets for span.amp, and you're set.

If you want to be really rad, you could combine this with widon't, like so:

jQuery(function($){
 
$('h1,h2,h3,h4,h5,h6').each(
    function(){
        $(this).html($(this).html().replace(/&amp;/g,'<span class="amp">&amp;<\/span>').replace(/\s([^\s>]{0,10})\s*$/,'&nbsp;$1'));
    }
);
 
});

Now your website is 2x hotter, guaranteed :)

Updated, per Paul's comment, to use jQuery's $.html instead of manipulating innerHTML on the actual DOM elements. Also updated to use a DOM ready callback, making it easier on folks who just want to copy/paste these snippets into their site.

TinyURL is amazing. They shortify any URL, so you can change from something long and heinous—think Google Maps addresses—to something far more palatable (ala http://tinyurl.com/2h5z5m). The end result is short, pithy, and emailable. They magically redirect it to the real URL for you, and the Internets are a better place for all of us. Check out their example:

As if this wasn't cool enough, TinyURL recently added the ability to tack on a custom alias. Now you can (optionally) choose a word or phrase to include in the hash portion of the tinyfied address, making it memorable as well as emailable. So now something like http://tinyurl.com/justin-hileman is possible.

Unfortunately the bookmarklet they provide only generates the old style TinyURLs with numbers and junk at the end. I use it all the time, so I decided it's time for an upgrade. I created a bookmarklet that lets you select a chunk of text to be used as the alias. it automatically converts the selected text so it's url friendly and everything!

Just drag this bookmark to your bookmark bar (or right click/save link as):

TinyURL!

To use it, browse to a page on the internet, select a word or two, and click the bookmarklet. MagicURL!

Note: this should work in any real browser. Read: you shouldn't expect anything in IE < 7. Aside: You shouldn't be using IE < 7, but that's another battle for another day...

Also: if you're reading this in a feed reader, there's a good chance that JavaScript has been stripped out of the bookmarklet. It's not gonna work like that. Visit the full post to get your TinyURL bookmarklet.

In the interest of more attractive Internets, here's a quick little javascript "widon't" snippet—written in jQuery—that I've been using. Now go do something cool with it.

jQuery(function($){
 
$('h1,h2,h3,li,p').each(
    function(){
        $(this).html($(this).html().replace(/\s([^\s<]+)\s*$/,'&nbsp;$1'));
    }
);
 
});

Feel free to replace or augment the selector ('h1,h2...p') with any additional elements you'd like to see widon'ted.

I actually use this variant, which lets longer words be widows if they wanna:

jQuery(function($){
 
$('h1,h2,h3,li,p').each(
    function(){
        $(this).html($(this).html().replace(/\s([^\s<]{0,10})\s*$/,'&nbsp;$1'));
    }
);
 
});

Note: Dave Cardwell posted a jQuery widon't a couple of years ago, but holy balls it's big... If you want something a bit more robust, be sure to check his out.

Another note: I added newlines and tabs to make the code more readable. If I were you, I'd remove those bad boys before deploying.

Update: I wrapped the snippets in a DOM ready callback, making it easier for those who just want to copy/paste these snippets into their site.

One of the most amazing and annoying things in Drupal 6 is the menu system. Thanks to a bunch of JavaScript magick, you can drag menu items around to reorder them, create submenus, and so forth. Unfortunately, once you've moved a menu item it no longer alphabetizes itself. If you want things to alphabetize themselves again, you are left with two options:

You can manually alphabetize the menu or submenu every time you change things or add a new menu item, forever and ever and ever. If you're not too keen on that idea, you can edit each of the menu items and reset their weight to 0, which makes them alphabetize again.

Neither option is ideal, so I created a third: this bookmarklet will set the weight of all menu items to 0 in one fell swoop. It also works for resetting block sort order, if you wanted to do that for some reason.

grab the bookmarklet after the jump.

i threw together a fancy little javascript bookmarklet to create redirects in drupal, and figured i'd share.

for this to work you need the path redirect and prepopulate modules installed... then simply replace "example.com" in the snippet below with your domain name, and save the link as a browser bookmark.

<a href="javascript:d='example.com/';location.href='http://'+d+'admin/build/path_redirect/new?edit[redirect][redirect]='+encodeURIComponent(location.href.split(/[\?#]/)[0].replace(RegExp('https?://'+d,'ig'),''))+'&amp;edit[redirect][query]='+encodeURIComponent(location.href.indexOf('?')&amp;gt;-1?location.href.split(/[\?#]/)[1]:'')+'&amp;edit[redirect][fragment]='+encodeURIComponent(location.href.indexOf('#')&amp;gt;-1?location.href.split(/#/)[1]:'')+'&amp;edit[path]='+encodeURIComponent(String(''+(window.getSelection?window.getSelection():document.getSelection?document.getSelection():document.selection.createRange().text)).replace(/[^a-zA-Z0-9]+/g,'-').toLowerCase());">new path redirect</a>

now click on it, and it will add a redirect to the current page. if you select any text before clicking the bookmarklet, it will use that text for the redirect path. this bookmarklet supports both internal (drupal) and external paths. it also works with urls containing queries (?foo=bar) and fragments (#baz). tested in ie, firefox and safari.

have fun!

justin hileman dot info has been updated. please allow me to draw your attention to the links at the bottom of the main page. i'm pretty excited about a couple. specifically the two with little arrows next to them.

you should click on them.