Check out, the project I'm currently working on.

Posted by Panayotis Vryonis

#en #howto #bucket3

Showing twitter references in a static blog

Weekend project: How to show under each static blog engine post the tweets that mentioned it.

bucket3 is my static-blog-generation engine, but it's also my little software project that helps me relax and learn new things.

After some time I hadn't added any (important) new features, this weekend I decided to add something I've been thinking about for years: I wanted my blog to show under each post tweets that mentioned it.

There are some easy ways to do it, probably by using Disqus or something like it. But I want my blog to be

  1. static: all important elements have to be served by a simple HTTP server (Amazon S3 currently)
  2. independent: I don't want to rely on any other sites for my blog to render.

I ended up using TwitterSearch, a pytrhon library "to easily iterate tweets found by the Twitter Search API" to add a new command to bucket3, invoked using bucket3 mentions.

When I run bucket3 mentions on my computer (where I write and render this blog, and then upload it to S3), bucket3 queries twitter for any reference to "". The script checks each reference to see if there is a link to a specific blog post, and if so saves the tweet in a local file. It also saves the twitter user avatar, because I didn't want to reference the one hosted by twitter in my pages. Then it marks the corresponding post source (usually a markdown file) as modified.

So, next time I run bucket3 update all modified posts are re-rendered (this has nothing to do with the post pub date) to include the referring tweets.

Some thoughts:

  1. Twitter users can change their profile images any time. Displaying the avatar as it was the time the user mentioned my posts, even if it is later changed, is something I like.
  2. Bucket3 saves the last tweet ID it got, and will only query twitter for tweets after it next time it runs. This means it is easy to delete unwanted tweets (ex. spam) by editing the file (it's a YAML file) that holds the tweets referencing each post.
  3. Twitter's simple design (a single global timeline, with immutable entries that can only be deleted) makes it much easier to implement such a feature, compared to other social networks where posts can be edited, they have comments, etc.
  4. On the other hand, the Twitter API has many limitations, including that it will only return tweets no older than 9 days and that "Search is focused in relevance and not completeness. This means that some Tweets and users may be missing from search results".
  5. I'll probably put bucket3 mentions in a cron job that runs every 30 minutes or so.
  6. It may be a good idea to do some grouping of identical tweets, but I'm not 100% sure. Maybe next time I dig into bucket3's code, I'll try it.

In a way, my static blog has a commenting engine too, now.

In the future, I intend to add more types of "mentions" in addition to twitter. It would be great for example if I could use to get and show webmentions.

Share on:   Twitter   Facebook   Linkedin   Google+   HackerNews  


Crafting a blog |
"[...] The first one is by tweeting your comment together with a link to the post. Your tweet will show up at the bottom of the post. It may take some minutes or hours to show up, but that's OK: I'm not really interested in hosting conversations on my blog, but providing my readers with ways to give feedback. [...]" -- 2013-09-27T14:02:18-07:00
webmention tests |
"[...] Fetching tweets that link to a specific post is fun and very useful. And it's working great so far. [...]" -- 2013-09-24T14:24:28-07:00

Tweets linking to this post

Panayotis Vryonis @vrypan
@aaronpk is there a way to get access to (as a service) to implement something like this? -- Tue Sep 17 12:32:13 +0000 2013
Apostolos @apas
Showing twitter references in a static blog via @vrypan — Looks great. -- Mon Sep 16 07:41:56 +0000 2013
Panayotis Vryonis @vrypan
Showing twitter references in a static blog (This tweet serves as a test too :-) -- Sun Sep 15 20:26:38 +0000 2013