Integrating My FriendFeed Comments Into My Personal Blog
My grand FriendFeed experiment ended in success today! After a week and a half of intense after-hours hacking and coding I finally found a solution that effectively brings in my comments from the FriendFeed social networking service and places them here in my own personal blog. If you’re at all interested in how I did it or how you might be able to do the same with your own site, read on.
Original Intent
As I’ve written about before, I’ve been struggling over the past month or so with integrating the multitude of social networks I’m invested in on this blog. My original goal for this blog was as a one-stop place for anything and everything that I do online. For the past two years I had been writing on two separate blogs—Seward Street (my character animation blog) and StoryFanatic (my screenwriting/storytelling blog). The amount of time spent upgrading and maintaining two separate WordPress installs was so annoying mainly because I had to do everything twice—not quite unlike taking care of two twin boys (which I also have to do).
ExpressionEngine and their MultiSiteManager was the solution.
The first half of this year has been spent setting up the individual databases and templates that would eventually serve my blogging needs for all my sites. Now, whenever I want to write something I login to my one ExpressionEngine panel, select which site I want to write to, and begin writing. Both sites, while appearing to be on separate servers, in reality access the same database for their content. I can also grab information cross-site, as I do with my character animation link list. Anytime I post a QuickLink here on my personal site that falls under the category of animation, it appears on that animation link list as well.
All was well and good until about a month ago when I discovered a brand new online addiction.
FriendFeed
At first I had trouble deciding whether or not I really needed yet another social site to hook myself into. I already had a Tumblr account, a Flickr account, a Pownce account, a Twitter account, a Facebook account, a del.icio.us account and so on and so on. Did I really need to enter my email address and come up with yet another password?!
The answer was yes. But it was an answer I didn’t discover until I actually started to participate.
I have no idea if my comments are at all annoying to others on my FriendFeed list. Most of them are very heavy into the social networking scene and at times it seems like they all know each other. I sometimes feel like I’m speaking up when I really have no business doing so. But FriendFeed makes it so easy that it’s hard to resist. It’s not like other blogs and sites where you have to enter your name, then your site, then click whether or not you want to be emailed any follow-up messages. Commenting on these sites is usually so time consuming that I rarely bother anymore.
But on FriendFeed, you just click comment, type in what you want to say and hit enter. That’s it.
Quickly and efficiently you’ve added to the conversation and you can move on to the next interesting part. You can also hide conversations you’re not interested in and block people who are annoying, but that is better explained elsewhere.
Separate Once Again
The only problem was that my utlimate goal of having one place to go for everything was now in jeopardy. I was making all these comments on FriendFeed, participating in all these interesting conversations, but I had no record of them here on my personal blog. I was split between services again and it was sqiftly becoming annoying to me.
In addition, I’ve always been bothered that there was no easy way to get my Google Reader comments on this site as well. GReader has a fantastically easy interface for adding notes to items that you find interesting and an even greater one in their mobile app designed specifically for the iPhon. But I always felt like it was a waste of time as there was no way to easily grab those comments in an RSS feed. In addition, the Google Reader Shared Items page is downright boring to scroll through. I rarely, if ever, looked at anyone else’s shared page as it’s just a bunch of regurgitated content with a few extra notes here and there. No, what I really wanted was something that would aggregate all my comments into one place.
FriendFeed turned out to be that service.
My GReader Shared Notes, my Twitters, my comments posted with del.icio.us links, my Tumblr items - everything found a home on my FriendFeed Comment page. It was the perfect solution and what was even better, the developers at FF even gave me an ATOM feed at the bottom of the page - perfect!
Unfortunately my struggle was not over yet.
FeedGrab Plugin and ExpressionEngine
ExpressionEngine has a great plugin for taking the items from RSS feeds and inserting them into your database - FeedGrab. Because of some initial difficulties I had using FeedGrab with my FF Comment page, I decided to try it out first with the RSS feed from my Twitter account. After much trial and error (which can probably best be summed up in the FeedGrab thread in the EE forums), I was successful. A day later I learned about cronjobs and the coolness they offer in doing things automatically when you’re not around. Within a couple of days I no longer had to think about my Tweets. I simply typed them in as I always had and a little while later they would end up in my ExpressionEngine database.
The feed structure for the FF Comments page turned out to be slightly more challenging.
Low-Level Attributes
I’m not sure if this is what they are called, but basically the information I needed to grab (my comments) were located several attributes down from what would be considered normal for RSS/ATOM feeds (like link, title, pubDate, etc.). The FriendFeed API documentation outlines their structure this way:
As you can see the actual comment lies further down in the chain - in fact, what I wanted was ff.comments.comment.body. Unfortunately at this time, FeedGrab doesn’t allow you to grab this lower level information.
That’s when I remembered Yahoo Pipes.
Piping It All In
About a year ago I discovered Yahoo Pipes as an easy way to filter out all the non-Disney content from one of the better sources for animation news, CartoonBrew. That simple pipe can be found here - The Best from CartoonBrew (I’m slightly biased towards Disney!). For those who don’t know, Yahoo Pipes offers a reasonably simple approach towards mixing and mashing RSS feeds into whatever content you want. The interface for it is fun and easy to use and most importantly - easy to learn.
But man, did it take me forever to figure out how to get this to work with my FriendFeed comments.
Everytime I tried to parse out the comments I would lose the top level stuff like the title and the link. I tried a million different combinations, cloning one pipe after another, trying desperately to figure out how to make it all work. I knew it had to be possible (and I’ll be really discouraged if there is already a feed like this available somewhere else!), but I just couldn’t logic it out with the tools Pipes gave me.
After about a week or so I had to turn to the Developer’s Forum for help. Thankfully I didn’t waste anymore time because there was NO WAY I would’ve figured it out. I had no idea that you could put a previously made Pipe into a Loop module (technical jargon - but Pipes lovers will understand what that means). With this bit of knowledge and a few more tweaks here and there I finally put the finishing touches on my masterpieces.
I give to you the FriendFeed Comments Pipes!
As you can see this First Pipe easily filters out my comments based on my nickname (which also happens to be my FriendFeed username). It’s probably better explained in the above link to the Developer Forum, but what I’m doing is taking the feed and first filtering it out by the Unique ID for each entry. The text input module is actually filled in with information in the second pipe (which you’ll see in a second). It then moves down to the comments (comments.comment) and filters out only those that share my nickname (username). In the following module it goes in and grabs only the body each comment. That last part was important because without it, this first pipe would send a whole bunch of unnecessary information along with the comment I wanted (like the User ID, comment ID, etc.).
Here is the main Grab Only Your Comments Pipe:
Here you can see that this pipe begins the same way by grabbing the same feed. But instead of filtering it out by ID (which was where I would get in trouble on my own), it calls the first pipe for the comments. You can see in that Loop module where it calls the “First Pipe” as it uses as the TextInput the ff.id information from each entry. Wonderful, right?! The result of that module is that all the comments are added to the description attribute—something FeedGrab could easily work with. The second loop was necessary as I wanted to make sure that I linked back to the original conversation. FriendFeed by default assigns the original article to the link attribute, not the conversation on FriendFeed. I though it was more important to link back to the conversation as that was where I was first introduced to the content.
That Loop module grabs the id and builds a URL with it (essentially making a link for each entry to http://friendfeed.com/e/[ff.id]).
Success and a Time for Celebration
Now I’m not sure if you’ll share in my elation, but hopefully you can appreciate the effort that went into it.. Most importantly though was how much damn fun it was! It was a great challenge to try and figure out which combination of pipes would work into the next and how I could finally elicit that information out of my feed. I can tell you that when those first results came back I felt a great sense of accomplishment.
If you check out the main page of my site, you’ll see that my FriendFeed comments are now threaded into my daily stream of articles that I write. Mixed in with pieces on character animation or storytelling are items that I find interesting enough to comment on in FriendFeed. I’m not completely pleased with the look of it yet, it’s a bit of a visual mess, but at least the information is there. For now I’m happy enough knowing that all my online interactions - my comments on FriendFeed, my Google Reader shared notes, my del.icio.us notes, my Twitters - ALL of them end up on my blog now.
Now the only question is, what’s the next challenge?
