Adding Social Bookmarks in Rails

Thinking of adding some social bookmarklets to your Rails project? Well, you should! It's a great way to drive traffic to your site and get that extra exposure. Now, while refactoring some of my code from Graphics World (you can see the code below at work in the right sidebar) I figured I should share this snippet since it's fairly tedious to setup. Here it is, in all its glory:

> social_helper.rhtml

    <%  current_uri = u(request.protocol << request.host_with_port << request.request_uri)
        title = u(@title)
 
        bookmarklets = {
            :delicious =>   ['del.icio.us', 'delicious.gif' ,'http://del.icio.us/post?url={{url}}&amp;title={{url_encoded_title}}'],
            :digg =>        ['digg it', 'digg.gif', 'http://digg.com/submit?phase=2&amp;url={{url}}&amp;title={{url_encoded_title}}'],
            :spurl =>       ['spurl', 'spurl.gif', 'http://www.spurl.net/spurl.php?title={{url_encoded_title}}&amp;url={{url}}'],
         #  :wists =>       ['wists', 'wists.gif', 'http://wists.com/r.php?c=&amp;r={{url}}&amp;title={{url_encoded_title}}'],
            :simpy =>       ['simpy', 'simpy.gif', 'http://www.simpy.com/simpy/LinkAdd.do?href={{url}}&amp;title={{url_encoded_title}}'],
         #  :newsvine =>    ['newsvine', 'newsvine.gif', 'http://www.newsvine.com/_tools/seed&amp;save?u={{url}}&amp;h={{url_encoded_title}}'],
            :blinklist =>   ['blinklist', 'blinklist.gif', 'http://www.blinklist.com/index.php?Action=Blink/addblink.php&amp;Description=&amp;Url={{url}}&amp;Title={{url_encoded_title}}'],
            :furl =>        ['furl', 'furl.gif', 'http://www.furl.net/storeIt.jsp?u={{url}}&amp;t={{url_encoded_title}}'],
            :reddit =>      ['reddit', 'reddit.gif', 'http://reddit.com/submit?url={{url}}&amp;title={{url_encoded_title}}'],
         #  :fark =>        ['fark','fark.gif', 'http://cgi.fark.com/cgi/fark/edit.pl?new_url={{url}}&amp;new_comment={{url_encoded_title}}&amp;linktype={{category}}'],
            :blogmarks =>   ['blogmarks', 'blogmarks.gif', 'http://blogmarks.net/my/new.php?mini=1&amp;simple=1&amp;url={{url}}&amp;title={{url_encoded_title}}'],
            :yahoo =>       ['yahoo', 'yahoo.gif', 'http://myweb2.search.yahoo.com/myresults/bookmarklet?u={{url}}&amp;t={{url_encoded_title}}'],
         #  :smarking =>    ['smarking', 'smarking.gif', 'http://smarking.com'],
         #  :segnalo =>     ['segnalo', 'segnalo.gif', 'http://segnalo.com/post.html.php?url={{url}}&amp;title={{url_encoded_title}}'],
            :magnolia =>    ['magnolia', 'magnolia.gif', 'http://ma.gnolia.com/bookmarklet/add?url={{url}}&amp;title={{url_encoded_title}}']
        }
 
     %>
 
   <div>
      <% bookmarklets.each_value { |bookmarklet|
            bookmarklet[2].gsub!(/\\{\\{url\\}\\}/, current_uri)
            bookmarklet[2].gsub!(/(\\{\\{url_encoded_title\\}\\})|(\\{\\{title\\}\\})/, title) -%>
 
        <p><a href="<%= bookmarklet[-1] %>" title="<%= bookmarklet[0] %>:<%= title %>">
            <img src="/images/social/<%= bookmarklet[1] %>" alt="<%= bookmarklet[0] %>" /> <%= bookmarklet[0] %>
        </a></p>
      <% } %>
   </div>

You can see a quick preview of the results on the left. If you don't like the layout or need to adjust the formatting just change the xhtml at the bottom of the template. You can also add/remove bookmarklets you wish to include by simply commenting out the hash values. Each value points to an array where first field is the service name, second is the image name (just in case), and third is the URL on which we will run a regex. If you see a missing service, or need to get the icons head here. If you add any new services to the hash, let me know, I'll add them to my sample above to make it easier for everyone.

Note that I'm using code above as a shared template, but you could easily turn this into a helper function. Also, I assume that you have a @title variable which corresponds to your current page title. If you use static titles, or a different scheme altogether, you'll have to modify it accordingly. And last, but not least, make sure you keep the u(...) function around the current URI and page title - it's there to URL encode both variables ('My Title' turns into 'My%20Title').

Download Bookmarklet Icons

Downloads: 599 File Size: 13.7 KB

About this entry

Published:: 20.10.06 / 9am

Category:: Ruby on Rails

Tagged:: rails, ror, Ruby, social

Social Bookmarks

blinklist:Adding Social Bookmarks in Rails

blogmarks:Adding Social Bookmarks in Rails

magnolia:Adding Social Bookmarks in Rails

snoza 21.10.06 / 1pm

Hi,

I’m new to RoR and ended up here because I was looking for a way to escape URLs (thanks for the hint BTW).

Just an FYI for W3C compliance fanatics (as I am), according to the W3C, the ampersands should be escaped even in an URL.

So to make this code pass validation you should use

&title={{url_encoded_title}}

in the hastable if possible.

Geat site, keep up the good work :)

Hrm, I obviously meant “&-a-m-p-;” sorry.

Ilya Grigorik 25.10.06 / 8am

snoza: good point, I found/fixed a couple of those in my list above!

Oddly Zen » Blog Archive » links for 2007-01-03 08.01.07 / 10pm

[...] igvita.com » Blog Archive » Adding Social Bookmarks in Rails Thinking of adding some social bookmarklets to your Rails project? Well, you should! It’s a great way to drive traffic to your site and get that extra exposure. (tags: rails ruby social snippets rubyonrails code Bookmarks) [...]

Nome do Jogo » Blog Archive » Colocando links para redes sociais no seu projeto Rails 25.06.07 / 9am

[...] Vi esta dica no blog do Ilya Grigorik. [...]

arslan 30.08.07 / 8am

please tell me about technorati, how we can book mark on technorati

Ilya Grigorik 01.09.07 / 3pm

Arslan, Technorati should be an easy one, the schema is:

http://technorati.com/faves?add=YOUR_URL

Chris 05.08.08 / 9am

Hi, I’m new to rails, I’ve been looking for ways to add social bookmarks using ruby on rails for a little while and I found this and I couldn’t believe my luck, but unfortunately I can’t seem to get it to work as it adds {{url}} as the url and {{url_encoded_title}} for the title to the relevant fields in the bookmarking site, but when I hover over the bookmark link it seem to recognise the page title e.g. del.icio.us:my page title.
any help would be greatly appreciated

Ilya Grigorik 09.08.08 / 2pm

Chris, I’m not sure I understand the problem. The code, as is, should pick up the current link and page title - are you looking to bookmark a specific (parent) page instead?