Bygg en twitterwidget för WordPress

I skrivande stund är det några dagar kvar till 2010 års riksdagsval. En av de bättre källorna till information och diskussion om valet är sökordet val2010 på twitter.

Därför tänkte vi att det kunde vara kul att ha en liten feed på fokus.ses förstasida med de senaste om valet från Twitter. Resultatet kan du se här. Men varför nöja sig med att bara kolla på vår twitterwidget när du kan bygga din egen? Läs vidare för att få reda på hur.

Uppgiften är att göra ett Wordpresstillägg med en widget som visar de fem senaste tweetsen från ett visst sökord, och som uppdateras automatiskt var femte sekund.

Det här inlägget kommer inte gå in på alla detaljer, så känn er mer än välkomna att ställa frågor i kommentarerna om det är något som behöver fördjupas. Det är också troligt att det finns bättre sätt att koda detta, så om ni har förslag på förbättringar, gör oss alla en tjänst och tala om det i kommentarerna!

Utöver Wordpress plugin-API behöver vi också stifta lite bekantskap med Twitters sök-API och jQuerys getJSON-metod.

Vi börjar med att göra en header som talar om för Wordpress vad tillägget heter, vem som har gjort det och så. Det är den här informationen som visas i tilläggsmenyn där man aktiverar tillägg.

Sen kommer lite kod som talar om att det finns en widget och att den har inställningar som ska sparas till databasen.
add_action("widgets_init", array('fokus_tweet_by_tag', 'register'));
register_activation_hook( __FILE__, array('fokus_tweet_by_tag', 'activate'));
register_deactivation_hook( __FILE__, array('fokus_tweet_by_tag', 'deactivate'))
All widgetkod ligger i en och samma klass, i det här fallet 'fokus_tweet by_tag'.
class fokus_tweet_by_tag {

	// Aktivera widgeten med default-inställningar

	function activate(){
		$data = array( 'title' => 'Massa tweets!' ,'query' => 'fokusredaktion');
		if ( ! get_option('fokus_tweet_by_tag')){
			add_option('fokus_tweet_by_tag' , $data);
		} else {
			update_option('fokus_tweet_by_tag' , $data);
		}
	}

	// Ta bort inställningar när den avaktiveras

	function deactivate(){
		delete_option('fokus_tweet_by_tag');
	}
Funktionen control() gör kontrollpanelen som uppdaterar widgetens inställningar.


Title:


Query:


		
Själva widgeten bor i funktionen widget(). Den börjar med att generera lite html utifrån våra inställningar.
 
' . $args['after_title']; ?>
Därefter kommer javascriptet som anropar Twitters API.

Slutligen stänger vi funktionen och registrerar widgeten och kontrollpanelen.
	    

';
	    echo $args['after_widget'];
	}

	function register(){
		register_sidebar_widget('Fokus tweet by tag', array('fokus_tweet_by_tag', 'widget'));
		register_widget_control('Fokus tweet by tag', array('fokus_tweet_by_tag', 'control'));
	}
} ?>
Du kan ladda ner en zip-fil med hela koden i sig. Observera att det inte alls är säkert att den funkar i din Wordpressinstallation. Framförallt behöver den anpassas till din HTML/CSS. Använd bara filen som en referens.
Och som sagt, alla förbättringar och funderingar mottages tacksamt. Lycka till!