When Iceland went bust and started selling .is domains I grabbed martin.is. Of course I did. That’s the kind of guy I am. Even as I swiped that credit card (and by “swipe” I mean “typed in all my info into the appropriate boxes.”) I knew I had no idea what I was going to use it for, but what the hey; I’ve done plenty of even stupider domain purchases that never led to anything1.
So finally, the other day I decided to set up a “lifestream”. An aggregate feed of all the highly interesting stuff I do on the web. Not because I think anyone particularly needs or wants to know. It just seemed like the kind of thing that goes on a domain called “martin is”.
I really didn’t want to spend loads of time on this. I have a job, a daughter and a blog that are all already wailing for my attention, so tried plugging all my stuffs into a WordPress install using FeedWordPress and a couple of other similar plugins, but I found the results to be (unreliable | explosive | bewildering)2.
Alrighty then. What services do I know of that aggregate information like this? FriendFeed! I headed over to FF, and sure enough; Within half a minute I had managed to plug all the crap I generate into one massive hunka’data. In addition to supporting a bunch of services Friendfeed actually does pretty well parsing feeds from other sources and cutting the entries into little blurbs. Now only to get it out of there and onto my domain.
Yeah, no. FriendFeed doesn’t really want you to do that. I checked out the api examples and discarded them since A: I want to save myself for when using Python will be special and really mean something to me, and B: Can’t really be bothered with OAuth right now. I glanced at the feeds and considered going back to my original idea of posting to WordPress via RSS (still thinking about that one…) and chuckled a bit about the ass-backwardsiness of using tabled layouts in a RSS feed.
In the end I stumbled over what seemed to be the quickest and dirtiest way of getting that dang feed up on my page. It turns out that this guy figured out that you can use the FriendFeed embeddable widget meant for embedding in your sidebar and such to show, say the 100 latest entries and style the results every which way you’d like. Huzzah! Such an easy fix! Glory be!
Easy my crudmuffin. So it turns out that the results from FriendFeed is tag soup. Pictures are for some reason nested in .media .images table tbody tr td .container a img, seemingly every single one of these classes comes with embedded styles and everything has generated class names that looks like Hamlet in rot-13. I’m going to cut this already dreary drivel short and give you some healthy advice if you are thinking about doing this:
1: ‘!important’ is your best friend.
In order to get anything done with this data you have to override the styles from FriendFeed. That means you have to add !important to pretty much any style you add in your CSS. Here’s a starter to get you, eh… started.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | #friendfeed, #feed, .entry, .entry .title .text, #friendfeed #feed .entry .body .ebody, .ebody .title, .body, .comments, .likes, .info, .media, .picture, .name, .services, .stats, .bottom,.text { background-color:transparent !important; } .entry { display:block !important; padding:10px !important; margin:10px !important; margin-top:0px !important; border:none !important; border-bottom:1px dotted #777 !important; min-height:70px; } .entry .body .ebody .media table { width:180px; float:right !important; display:inline !important; } .info { color:#eee !important; font-size:0px !important; } |
I think it was legendary Flash guy Colin Moock who used to say “If it doesn’t work; Wait a frame.” Well. If it doesn’t work here; Smack !important on the end of it. The snippet above doesn’t kill all the embedded styles, it just kills all the ones I needed to get rid of.
jQuery is your other best friend, who is just as good a friend as the first one. Really. You have two best friends!
With jQuery I was able to do all kinds of neat stuff. For example I wanted to add a class to each entry with the name of the service they originated from so I could add an icon and do that sexy toggle-thing.
Here’s how to do that:
1 2 3 | $('div.entry>:contains("from Twitter")').parents('div.entry').addClass("twitter"); $('div.entry>:contains("from Evernote")').parents('div.entry').addClass("evernote"); $('div.entry>:contains("from Flickr")').parents('div.entry').addClass("flickr"); |
Nice. I also wanted to change the link text for my Github entries. They showed up as “ctrloptcmd’s activity” which isn’t really informative. Here’s a snippet that’ll yank that link out, change the text and shove it back in.
1 | $(".github").html($(".github").html().replace('<a class="service" rel="nofollow" href="http://github.com">ctrloptcmd\'s Activity</a>','<a class="service" rel="nofollow" href="http://github.com/ctrloptcmd">GitHub</a>')); |
On a roll now. I also wanted to get rid of the “Comment” and “Like” links from the original FriendFeed, eh, feed. FriendFeed does a good job at aggregating my stuff, but I’m sorry to say that I have no interest in joing their “community”, and I don’t want to send people there to comment when I won’t be answering. (Sorry FF. There’s just so much going on in my web life right now.)
So let’s sniff out those links and remove them.
1 | $("a[href*='/friendfeed.com'], a[href*='.friendfeed.com']").remove(); |
That last one is a gem. It finds any link any part of FriendFeed and removes that entire A-tag.
The rest, as they say, is more bloody JavaScript and facepalms.
I might try to slap together something more solid at some point, but for a completely pointless vanity page I think it’ll keep for now.
Now if you’ll excuse me I have to go bookmark some highbrow shit in case someone’s reading my vanity page.
Possibly related posts:
- The Parallax WordPress theme open sourced I’ve been meaning to release the theme of this blog...
- A few random AppleScript snippets I was just writing an AppleScript to look up words...
- TextMate theme-switcher script Summary: In which Martin ponders solutions on how to quickly...
- Some Path Finder AppleScripts How’s that for a TitleCased title? So I’ve been checking...
- The last WebMaster If you have been around on the web for ten...
