Questo tutorial spiega come aggiungere, tramite jQuery, gli ultimi aggiornamenti di un account Twitter sul proprio sito con poche righe di codice JavaScript.

Utilizzeremo il metodo ajax di jQuery per prendere tramite jsonp gli ultimi aggiornamenti relativi al nostro account utente.

Il codice:

1
2
3
4
5
6
7
8
9
10
11

jQuery.ajax({
		url: "http://search.twitter.com/search.json?q=from%3Akifulab",
		type: 'GET',
		dataType: 'jsonp',
		timeout: 1000,
		error: function(){ jQuery("#twitter").html(":#"); },
		success: function(json){
			item = json.results[0];
			jQuery("#twitter").html('&ldquo; <em>'+item.text+'</em> &rdquo;');
		}	
	});

Le variabili da configurare per personalizzare il proprio script sono:

1

url: "http://search.twitter.com/search.json?q=from%3Akifulab",

Url, è l’URL da cui prendere gli updates di stato. L’ultima parte contiene il nome dell’utente di cui volete recuperare gli updates. (da notare che la forma della query è codificata)

1

error: function(){ jQuery("#twitter").html(":#"); },

Error, è la funzione che viene eseguita in caso in cui ci sia un errore ad aprire l’URL di cui sopra (nel caso dell’esempio inserisce la stringa “:#” nell’elemento che ha id “twitter”

1
2
3
4

success: function(json){
			item = json.results[0];
			jQuery("#twitter").html('&ldquo; <em>'+item.text+'</em> &rdquo;');
		}

Success, definisce la funzione da chiamare quando la richiesta ajax ha esito positivo. Da notare che è necessario passare come argomento l’oggetto json per poter accedere agli updates.
Nel caso dell’esempio riportato quello che facciamo è semplicemente aggiungere il testo dell’ultimo update all’elemento html con id “twitter”.

Ovviamente è possibile sperimentare soluzioni molto più articolata di questa come ad esempio recuperare più updates oppure updates da più account.

Enjoy