Oggi vediamo come realizzare un widget meteo PHP personalizzabile e facilmente adattabile su tutti i tipi di layout web che sfrutta le api di Yahoo.
Panoramica del Widget Meteo PHP
[button link=”http://www.targetweb.it/tutorial/2014/meteo-widget-php/index.php” color=”blue” target=”blank” size=”large”]Demo[/button]
Quante volte il vostro cliente vi ha chiesto di integrare la situazione meteo sul proprio sito e siete dovuti ricorrere a widget esterni come meteo.it et simila (difficilmente integrabili al meglio con i layout più moderni). Questo plugin/widget scritto in PHP vi permetterà di recuperare le informazioni meteo su una specifica città e di personalizzare il render dei dati come meglio preferite, in perfetto stile con il vostro layout. Il widget sfrutta le api di Yahoo Meteo.
Concept e funzionamento
Yahoo permette tramite le sue api di richiamare in qualsiasi momento un file XML contenente il bollettino meteo della città passata attraverso il parametro dell’url. Una volta richiamato il file XML ed opportunamente elaborato con PHP, noteremo la presenza, fra le altre numerose informazioni, di un codice di stato metereologico. Da qui mi è venuta l’idea di poter abbinare il code-status con un immagine a nostra scelta (quelle di default di yahoo sono oscene). Oltre a questo il file XML contiene altre info davvero molto utili come velocità del vento, maree, pressione e ovviamente temperatura e condizioni generali del tempo. Ecco un esempio per costruire, da soli e in perfetta autonomia, un piccolo estratto delle condizioni meteo di default:
//Nota: il feed url è una var passata alla funzione PHP //Trovo e recupero il feed $content = file_get_contents($feed_url); //Creo la variabile XML per poterlo elaborare e gestire $xml = new SimpleXmlElement($content); //Elaborazione e visualizzazione risultati foreach($xml->channel->item as $entry) { echo "<h2>" . $entry->title . "</h2>"; echo "<div>" . $entry->description . "</div>"; }
Come avrete modo di vedere già usando due semplici parametri del channel riusciamo ad ottenere una panoramica completa del tempo. Trovate una dscrizione completa dei channels e parametri da poter elaborare e gestire a questo indirizzo:
[button link=”http://developer.yahoo.com/weather/” color=”blue” target=”blank” size=”large”]Documentazione Yahoo Meteo API[/button]
Uso del Widget Meteo-Targetweb
- Vai sul sito (consiglio la versione inglese) : http://weather.yahoo.com/
- Cerca la località desiderata (sceglila dell’auto complete)
- Estrai dall’url il codice di sei cifre: es. http://weather.yahoo.com/italy/liguria/ceriale-713789/
- Usa il codice php nella tua pagina web per richiamare il widget:
<?php include('meteo-feed-targetweb.php'); ?> <?php getMeteoTargetweb("http://weather.yahooapis.com/forecastrss?w=713789&u=c"); ?>
NOTA: Il parametro dell’url &u=c indica di usare i gradi centigradi al posto dei fahrenheit.
Il gioco è fatto! Puoi facilmente personalizzare lo stile del plugin agendo sui seguenti file:
- meteo.css : Agite su questo file per modifiche le regole di stile
- meteo-feed-targetweb.php: Agite su questo file per modificare la struttura/immagini usate dal widget
Conclusioni e Download
Il widget è open-source modificabile a vostro piacimento in tutte le sue parti. Volendo potete creare la vostra versione a partire da quanto scritto in questo articolo, se non avete tempo potete scaricare una versione già pronta e funzionante che vedete nella demo e rielaborarla come meglio credete, per il download chiedo solo una donazione libera (importo minimo di 1€ = 1 Caffè). All’interno dello zip oltre allo script troverete anche il download con la raccolta delle icone meteo realizzate a Alessio Atzeni, che potete trovare gratuitamente a questo indirizzo.
[symple_divider style=”solid” margin_top=”20px” margin_bottom=”20px”]
Questo articolo ti è stato utile? Condividilo sui tuoi social network preferiti oppure commenta l’articolo qui sotto!
Ottimo articolo 😉
Complimeti. Articolo utilissimo
Ottimo widget.
Ciao Riccardo,
Complimenti per il tuo codice!
Domanda: è possibile recuperare anche la velocità del vento da Yahoo?
Credo sia abbastanza semplice, ma non ci riesco.
Grazie in anticipo.
Andrea
Ciao Riccardo, purtroppo il tuo script non funziona più. Evidentemente ci sono stati dei cambi nelle api di yahoo. Se risolvi potresti aggiornare l’articolo? Grazie 🙂
Ciao ti ho inviato ieri 1 euro via pay Pal per il codice ma non l’ho ancora ricevuto.
Grazie.
Ciao, strano controllo. Ho aggiornato l’articolo con il download in chiaro.