Blackbird script for your site: allow tweet embedding!

Posted: May 6th, 2010 | Author: | Filed under: hacking | Tags: , | View Comments

With the Publitweet Blackbird bookmarklet we released yesterday you can grab any tweet on Twitter.com and embed a static HTML version on your site in no time.

Today we release a version for your site, to turn the tweets you have embedded, embeddable in turn!
Even better, people who will embed the tweet from your site will see that it comes from there as a source! How cool is that?

See an example:

Just released a bookmarklet for Twitter Blackbird. Get the HTML code of a tweet in 3 steps instead of 9! http://bit.ly/aL4QVGWed May 05 04:49:11 via publitweet.com

How does the magic work?
Well you just have to add this line at the end of your page (typically in your footer, just before </body>):
<script src='http://publitweet.com/blackbird/javascript.js'></script>

I already have tweets displayed on my site, how can I make them embeddable?
Just add a link like this one: <a href="javascript:publitweetGetEmbedCode('http://twitter.com/xdamman/statuses/13407123815');">embed this tweet</a>
Alternatively you can also replace the tweet permalink with just its id (ie. the latest part of the permalink: ’13407123815′).


Blackbird bookmarklet: publish a tweet in html

Posted: May 5th, 2010 | Author: | Filed under: hacking | Tags: , , , , | View Comments

Today, Twitter released Blackbird, a simple tool to “quote” an individual Tweet by getting an HTML code that you can place into a WordPress post or elsewhere. Previously, people wanting to quote Tweets had to take a screenshot, crop it, save it, upload and insert it.

It’s a step forward, but the Blackbird process is still very long!

  1. Copy the full URL of a tweet (e.g. http://twitter.com/xdamman/status/13405149731)
  2. Go to http://media.twitter.com/blackbird-pie/
  3. Click on the input text field
  4. Paste the URL
  5. Click on “Bake it”
  6. Click on the text area where the HTML code is created
  7. Select all text (press ctrl+a or cmd+a on a Mac)
  8. Copy (ctrl+c or cmd+c on a Mac)

And now, finally, you can paste the code into WordPress or elsewhere. TOTAL: EIGHT steps to have the HTML embed code in your clipboard!!!

We have a better solution:
drag and drop this bookmarklet link:

BlackBird bookmarklet

to your Bookmarks Bar. Now, getting HTML code to embed a tweet is as easy as 1-2-3:

  1. Go to the URL of a tweet (e.g. http://twitter.com/xdamman/status/13405149731)
  2. Click on the bookmarklet
  3. Copy (press ctrl+c or cmd+c on a Mac)

That’s it! Your code is on your clipboard and ready to be pasted anywhere.

Bonus: you can even go on  anyone’s twitter page (e.g. http://twitter.com/xdamman), or a twitter list (e.g. http://twitter.com/publitweet/team) and click the bookmarklet, a new link “” will appear below each tweet. Just click the link and here we go, you can now copy the embed code to your clipboard!

To close the overlay, just hit the escape key. It’s that simple.

Here’s what it looks like (it automatically adapts to the look & feel of your blog template):

Just released a bookmarklet for Twitter Blackbird. Get the HTML code of a tweet in 3 steps instead of 9! http://bit.ly/aL4QVGWed May 05 04:49:11 via Tweetie

If you have questions or want to contribute, get in touch on Twitter @xdamman

Mini FAQ:

  • If the tweet is removed by its author, will the embed code still work?
    Yes, the embed code is the full HTML version of the tweet. So the tweet will appear in your blog post forever
  • Is this the exact same embed code as if I was using the official Twitter Blackbird?
    Yes with one single exception: we display the absolute date and time of the tweet instead of “X minutes ago” — which we found totally meaningless since the time of the tweet doesn’t  update with the current time (remember, it is the static html version that you get).
  • What is Publitweet?
    Publitweet is a platform for curating and publishing Twitter. We are still in (semi-)stealth mode. We work with selected partners such as the San Francisco Chronicle, LeMonde, or Robert Scoble. If you are interested, keep in touch by following @publitweet (and don’t hesitate to ping us on Twitter!).

Thanks a lot to this awesome tutorial on how to make a bookmarklet