Blogger Hacks, Categories, Tips & Tricks

Thursday, May 25, 2006
Recursive Backlinks
Here is the latest in my "Just because you can, doesn't mean you should" series of bloghacks. In this one, I build on Adi's excellent Native Blog Search hack (incorporating Singpolyma's rss2json service). The idea is to replicate more-or-less Blogger's Backlink feature, but with a twist.

For starters, it's dynamic, so it will always get the freshest links out of Google's blogsearch. You also get the first paragraph in the tool-tip when you move your mouse over the link. And - here's the recursive bit - when you click the ~> at the end of each backlink, it will run off to fetch the backlinks for that backlink and insert it amongst the others as a nested list. This can continue ad infinitum as readers explore the web of backlinks (back-backlinks? meta-backlinks? ancestor-posts?) to your blog.

My Speccy blog isn't particularly well-connected, but if you jump off from this post, scroll half way down the sidebar and look for "Posts that link here". Then, click on "Shock! AFL ..." link, you'll get a taste for what's going on.

If you'd like to get this happening on your own blog, then add this to your header:

<ItemPage><script type="text/javascript" src="http://ghill.customer.netspace.net.au/backlinker/backlinker.js">
</script></ItemPage>


Then put this in your sidebar or wherever makes sense for you:

<ItemPage><h2 class="sidebar-title">Posts That Link Here</h2>
<div id="backlinks">
   No backlinks found.
</div>
<script type="text/javascript">
backlinker();
</script></ItemPage>


Note that I suggest wrapping both parts in Blogger's ItemPage tags, since you probably don't want to see this on archive and main pages.

At the moment, I'm using ~> to indicate "there may be more backlinks ... go on, give it a click!" and ] indicates "no, I've looked and this is a dead end". If anyone can suggest more natural/obvious symbols/icons to use, I'd love to hear from you.

Source code is viewable here. I've just modified it to use the window.location.href as the initial search query, and prettied up the output as a (nestable) unordered list. Oh, plus some housekeeping around retaining/swapping elements around.

So is the world ready for recursive backlinks? Probably not. But still, there's gotta be plenty of other uses we can put this integrated search hack to work on.

Filed in: , , , ,
Posted at 2:30 AM by Greg.
5 Comments:
<    >
Blogger Aditya said...
Hahaha!! xD

Clever! Very clever! :D Good work!

<    >
Blogger Greg said...
I've modified the recursive backlinks hack so that it can also work as a more "traditional" keyword search.

If you pass it a search query starting with "http://" it assumes you're looking for backlinks, and pre-fixes "link:". Otherwise, it assumes it's a keyword search and post-fixes "blogurl:window.location.hostname".

To use this functionality, just put this in your sidebar:

<h2 class="sidebar-title">Search</h2>
<p><input type="text" size="25" onFocus="this.value=''" onBlur="javascript: backlinker(this.value, 'search-box');" value="Enter Query"></input>
<input type="button" value="Search"></input></p>
<p id="search-box">
</p>

(If this is going on all pages, make sure you don't have ItemPage tags around the external script call in the header.)

<    >
Blogger Greg said...
Oh - for reasons I can't fathom, Internet Explorer doesn't like the empty paragraph in the above.

Try:

<p id="search-box">
&nbsp;</p>

for the last two lines. Or, put a pithy message (that will get over-written with search results.)

<    >
Blogger Sunil Kumar Gupta said...
Nice very nice

<    >
Blogger Junio said...
They don't work anymore... :(

Links to this post:

Create a Link


eXTReMe Tracker