Brightkite Badge Widget
I’ve been getting a lot requests for the code to my Brightkite badge. It’s the “Where I’m At” status you see on my page near the top on the right. Instead of sending the same email over and over again, I decided to post the code here.
First, since this uses the SImpleXML extension, you need to make sure that you have PHP 5 or greater installed on your server. SimpleXML makes it so incredibly easy to convert XML into an object that then can be manipulated normally.
Below is the HTML and PHP code I used to create my Brightkite badge. I tried to put a lot of comments in the code to explain my thought process and what the code was doing. It’s not much code once you take out all the comments. It’s really not very complicated at all.
If anyone has any questions or ways to make this better, please don’t hesitate to send me an email or leave a comment.
<div id=”brightkite_where_im_at”>
<h2>Where I’m At</h2>
<?php/* puts your checkins feed into the $xml varibiable using simplexml, this require php 5.X */
$xml = simplexml_load_file(”http://brightkite.com/people/andrewacomb/objects.xml?filters=checkins”);/* compares the name variable with the display_location variable, if they are the same returns 0, if different returns another number other than 0 */
$same = strcmp($xml->checkin[0]->place->name, $xml->checkin[0]->place->display_location);/* scope is a variable in the Brightkite feed that describes the checkin, it could be an address, city, state, or something like that, if the scope if an address AND if the address and name variable are not the same, then the address has a name associated with it so this will ouput for example ‘currently at Hudson Photography on 321 Pacific Ave, Bremerton, WA, USA, update 5 minutes ago’ */
if ($xml->checkin[0]->place->scope==”address” && $same!=0) {
echo ‘currently at <a href=”http://brightkite.com/places/’, $xml->checkin[0]->place->id, ‘”>’, $xml->checkin[0]->place->name, ‘</a> on ‘, $xml->checkin[0]->place->display_location, ‘<span id=”brightkite_updated”> updated ‘, $xml->checkin[0]->created_at_as_words, ‘ ago</span>’;
}/* if the scope is an address AND if the address and name are the same, then the address does not have a name associated with it so this will output for example ‘currently at 321 Pacific Ave, Bremerton, WA, USA, updated 5 minutes ago’ rather than having it say ‘currently at 321 Pacific Ave, Bremerton, WA, USA on 321 Pacific Ave, Bremerton, WA, USA, updated 5 minutes ago’, that make no sense */
elseif ($xml->checkin[0]->place->scope==”address” && $same==0){
echo ‘currently at <a href=”http://brightkite.com/places/’, $xml->checkin[0]->place->id, ‘”>’, $xml->checkin[0]->place->display_location, ‘</a>’, ‘<span id=”brightkite_updated”> updated ‘, $xml->checkin[0]->created_at_as_words, ‘ ago</span>’;
}/* if the the above two conditions are not met, this will be the default, it will print for example ‘currently in Bremerton, WA, USA, updated 5 minutes ago’ */
else {
echo ‘currently in <a href=”http://brightkite.com/places/’, $xml->checkin[0]->place->id, ‘”>’, $xml->checkin[0]->place->display_location, ‘</a>’,'<span id=”brightkite_updated”> updated ‘, $xml->checkin[0]->created_at_as_words, ‘ ago</span>’;
}/* this prints ‘follow me on Brightkite’ which links back to your Brightkite profile */
echo’<p><span id=”brightkite_follow_me”><a href=”http://brightkite.com/people/’, $xml->checkin[0]->creator->login, ‘”>follow me on BrightKite</a></span></p>’;?>
</div>
Below is the CSS I used to style my Brightkite Badge. You will definitely have to modify this for your site. I enclosed the entire Brightkite Badge with the “brightkite_where_im_at” div tag. I styled the “h2″ tag because I wanted “Where I’m At” on the left with a line underneath it. I used a “brightkite_update” id to make the “updated 2 days ago” text slightly smaller than the rest of the text. I used “brightkite_follow_me” id to align the “follow me on Brightkite” text to the right.
#brightkite_where_im_at{
width:265px;
height:50px;
}
#brightkite_andrewacomb h2{
font-size:1.2em;
margin-bottom: 5px;
color: #dbf1fc;
border-bottom: 1px #c8eb94 solid;
}
#brightkite_updated {
font-size: 0.8em;
}
#brightkite_follow_me {
text-align:right;
}
Again if anyone has any questions or ways to make this better, please don’t hesitate to send me an email or leave a comment. I will always get back to you.
If you use all or part of the code to create your own Brightkite badge, put a link to your site in the comments.
