Friday, 15 April 2005

Help others bookmark your posts on Del.icio.us or Furl






You can make it easy for others to bookmark your blog or individual posts on Del.icio.us or Furl (the free services which let people save their bookmarks online and, most interestingly, share them with others and see what Webpages others are bookmarking - hence their description as "social" bookmark managers).

By adding some simple code to your template you can produce links which, when clicked, will open a new window to let your readers add your blog or post to their bookmarks on Del.icio.us or Furl, pre-filled in with your blog or post title and its URL (just the same as if they had clicked on a (non-popup) bookmarklet for Del.icio.us or Furl installed on their own browser toolbar). To see how it works just try the links at the top of my blog's main page, or the top/bottom of my individual posts. (Obviously it will only work for people who already have accounts with Del.icio.us or Furl!)

The only twist is that there will be a prompt to log in to Furl, even if the reader is already logged in - i.e. they have to login again (that's what I've personally found, anyway), and I've not figured out how to fix this yet while keeping the links generic. Still, I hope this code will be useful. ([Added 3 July 2005:] I've now tweaked the code so that you don't have to login again with Delicious, though you still have to for Furl. See this post.):

So, here's the code for producing a link to bookmark your blog, which you can copy and paste into your template anywhere you like:
Bookmark this blog on <a href="http://del.icio.us/post?url=<$BlogURL$>&title=<$BlogTitle$>" target="_blank">Del.icio.us</a> or
<a href="http://www.furl.net/storeIt.jsp?t=<$BlogTitle$>&u=<$BlogURL$>"
[Added 5 Feb 2006:] Note also that following the comment below from Michael of Furl, you can change the Furl code as follows so the reader can save your post direct in Furl if they're already logged in; however I've not changed my original code because from testing I've found out that if they're not already logged in, while there is a prompt to login, after logging in the post doesn't get saved on Furl at all, in fact nothing happens. I'd prefer to make the reader login twice than not have the code work at all, obviously. Here's the code incorporating his suggestion:
<a href="http://furl.net/store?store=true&title=<$BlogTitle$>&url=<$BlogURL$>" target="_blank">Furl</a> target="_blank">Furl</a>
The code above is Blogger-specific but for other platforms just change "<$BlogURL$>" to whatever is the code on your platform for your blog URL or just change it to your blog URL direct e.g. "http://consumingexperience.blogspot.com/" (without the quotes) and change "<$BlogTitle$>" to your blog title, with "+" instead of spaces if there are multiple words e.g. "A+Consuming+Experience" (again without the quotes) - or you could change them to whatever template tag is the equivalent shorthand on that platform for your blog title. Here's an example (I've put the bit to change in bold):
Bookmark this blog on <a href="http://del.icio.us/post?url=http://consumingexperience.blogspot.com&title=A+Consuming+Experience" target="_blank">Del.icio.us</a> or <a href=""http://www.furl.net/storeIt.jsp?t=A+Consuming+Experience&u=http://consumingexperience.blogspot.com" target="_blank">Furl</a>
For bookmarking an individual post, this is the code to copy/paste - put it between the <Blogger> and </Blogger> tags in your Blogger template (again it can be tweaked for other platforms by changing the bits in bold for whatever is shorthand on your platform for the item permalink (<$BlogItemPermalinkURL$>) and item title (<$BlogItemTitle$>) respectively, e.g. change "<$BlogItemPermalinkURL$>" to "<$MTEntryPermalink$>" and <$BlogItemTitle$> to <$MTEntryTitle encode_url="1"$> for Movable Type, but it must be placed between the template tags which cycle through to display your individual posts):
Bookmark this post on <a href="http://del.icio.us/post?url=<$BlogItemPermalinkURL$>&title=<$BlogItemTitle$>" target="_blank">Del.icio.us</a> or <a href="http://www.furl.net/storeIt.jsp?t=<$BlogItemTitle$>&u=<$BlogItemPermalinkURL$>" target="_blank">Furl</a>
Obviously you can change the "Bookmark this blog on..." or "Bookmark this post on…" text to anything you like, or delete the code for Del.icio.us, or delete the code for Furl, as you wish. And similarly if you don't want a new window to open, delete the "target="_blank"".

[Added 5 Feb 2006:] Note also that following the comment below from Michael of Furl, you can change the Furl code as follows so the reader can save your post direct in Furl if they're already logged in; however I've not changed my original code because from testing I've found out that if they're not already logged in, while there is a prompt to login, after logging in the post doesn't get saved on Furl at all, in fact nothing happens. As mentioned above, I'd prefer to make the reader login twice than not have the code work at all, obviously. Here's the code incorporating his suggestion:
<a href="http://furl.net/store?store=true&title=<$BlogItemTitle$>&url=<$BlogItemPermalinkURL$>" target="_blank">Furl</a>
How did I get the idea, Mud wanted to know? Well I'm no hardened coder (though I'm starting to pick up bits of Javascript etc). What I am is basically idle, but quite good at noticing pattern/structure, and from that working out generalised rules and shortcuts which can help me save time and work.

In this case, there's probably some fancy programming that can be done to get the same result, but I just noticed that if I wasn't already logged in to Del.icio.us and I clicked their bookmarklet (the non-popup version) to bookmark webpages, in the resulting window there was a pattern to the URL in the location bar which reflected the URL and title of the page I was bookmarking. (You can find the bookmarklets on their "About" page but they are only visible if you've logged in.)

I figured that if I entered that URL direct into a browser, it would have the same effect as if I clicked the bookmarklet while on the Webpage (exactly as with my code to auto-translate blog posts or to add a post to a Technorati watchlist, etc) - and so it proved when I experimented. I just adapted that basic URL structure to incorporate the special shorthand template tags which I'd learned can be used to insert the blog or post's URL and title. [Added 5 Feb 2006:] I've since figured out HTML forms, get and URLs - see this post.

With Furl it took a bit more doing, but applying the same principle I checked the page properties/info for the popup window you get on clicking their bookmarklet to find out the right URL to use, and looked at the code for their bookmarklet to figure out what to add to fill in the URL and page or blog title. (I had until recently included on my blog only the Del.icio.us links, and not Furl, as Furl were in my bad books for not answering some (unrelated) queries I'd put to them, plus I got some traffic from Del.icio.us but virtually none from Furl, so it seemed to me Furl was very much less popular. When Furl finally replied, some 2 months later, I decided I'd include their links. I'm still waiting for their replies to my follow up queries though. Maybe in another month or two…?).


Technorati Tags: , , , , , , , , , , , , , , ,

8 comments:

TaB said...

Yet another valuable tutorial / content post. I really need to start trying a few of these out myself. Ive printed a few out to save, maybe when I get home. :)

Boy you have been busy too, I’ll return tonight/tomorra to re-read the rest, and boy we need to get you a css container for source code huh? Thanks for taking the time to explain these complex issues Improb.. Its quite valuable.

Improbulus said...

Thanks again for your kind comments Tab, it's really great to know that you think this stuff is useful and that it's worth my writing it! (You of all people wouldn't need the explanations I'm sure, but I have in mind more people like me who are still starting up that learning curve and could do with someone just a little bit ahead of them, and therefore familiar with the struggle, passing on what they've learnt). Yeah that source code problem, have to fix it one day...

SatishTalim said...

Very helpful. Thanks.

fantababy said...

all your posts are useful, informative and helpful to the blogging community as a whole. My sincere wishes!

John said...

Many thanks for the code for the Furl link. Much appreciated!!

Improbulus said...

Thanks for your comments, SatishTalim, fantababy and John!

Michael said...

If you want to store a page on Furl.net without a save dialog, try replacing "http://furl.net/storeIt.jsp?u=URL&t=TITLE" with "http://furl.net/store?store=true&url=URL&title=TITLE". Hope that helps!
-- Michael (from the Furl Team)

Improbulus said...

Thanks Michael, I'll amend my post to make that change.