Come creare un widget: 'Che tempo fa'

I widget del CMS di vBulletin (e in genere) sono piccoli elementi grafici inseribili nello spazio spazio libero del portale. Creare widget può diventare un lavoro a tempo pieno, considerato che l'inserimento delle informazioni in uno spazio ristretto e combinare tutto allo scopo di rendere vBulletin più funzionale e utile per i visitatori non è semplicissimo. Dall'altra parte, il frontespizio di un sito è la porta di ingresso, e se resta sempre uguale, non attira più la curiosità innata do ognuno di noi.


Questo articolo mostra come creare un widget che dimostra "Che tempo fa", sempre sincronizzato con un database presente sul sito offerente (host). Prima di tutto dobbiamo recarci su uno dei siti che offrono il codice pubblicamente accessibile e possibilmente gratuito. Uno di questi siti è Il Meteo, che alla pagina indicata mostra come ottenere il codice per il widget che si trova su questo portale.


Sulla pagina sono presenti diversi collegamenti, fra i quali scegliamo la località desiderata, per noi: Bologna città. Si possono scegliere perfino piccoli comuni, che rende questo sito piuttosto unico.


Una volta che abbiamo scelto la località, passiamo allo stile (layout) del widget. A secondo la destinazione finale ci sono disponibili diversi formati, che essenzialmente si dividono per visualizzazione orizzontale e verticale. Nei portali, lo spazio è diviso per colonne ed è più probabile che si scelga il formato verticale. Altezza e larghezza quindi dipendono dal numero di dati e dal formato scelto in questo riquadro:



Nel riquadro accanto è possibile scegliere i contenuti e il formato dei dati visualizzati ed eventuali informazioni aggiuntive:


Infine bisogna dare a tutto l'aspetto che combacia bene con lo stile grafico del nostro sito, in modo che non contrasti troppo:


Nell'ultimo riquadro si genera il codice da inserire nel nostro widget:


Ora andiamo nell'ACP per creare il widget:


Nella maschera che elenca i widget già disponibili, andiamo in basso e clicchiamo sul pulsante Crea nuovo widget:


Nella maschera che si apre inseriamo il titolo (così come appare agli utenti) e una descrizione che servirà a noi a ritrovare il sito per eventuali modifiche e altre informazioni:


Dopo il salvataggio appare in lista a tutti gli altri widget:


Clicchiamo sul collegamento "Modifica" alla destra. Si apre una finestra che ci permette di incollare il codice. Per migliorare l'aspetto grafico, mettiamo il codice fra i due tag div con align="center":


Alla fine salviamo ed è pronto per l'utilizzo!