Number 5 in Widget-A-Day is a Weather widget.
It isn’t too fanciful. It displays the current condition, temperature, and the feels like temperature. It uses weather.com‘s xoap api to retrieve the information. I’ll probably come back to this and make it better.
svn co http://svn.wp-plugins.org/weather-widget/trunk
- WordPress 2.2 or 2.0.x/2.1.x with WordPress Widgets
- PHP 4.3.0 or greater (needed for function file_get_contents)
- Download weather.zip
- Extract and upload weather.php to the plugins/ directory
- Enable Weather Widget in the Plugin admin panel
- In widget admin panel, place Weather in the sidebar, and edit it to enter your location
The location can either be a zip code for US users or the locid. To find the locid, you can do a search using
http://xoap.weather.com/search/search?where=[search parameters].This will return an XML file with search results and their corresponding locid’s.
You can also find it out by the Weather.com website. After searching for and selecting you city, you will be sent to a url that will look something like,
http://www.weather.com/outlook/driving/interstate/local/USTX0617?from=search_city, where USTX0617 is the locid.
I’ve provided the images used and provided by weather.com here. If you want to host your own images, extract and upload the files, then, in the admin panel, edit the ‘Image Location’ field to point to your directory of images. Make sure to have the trailing slash.
If you don’t use your own images, you are free to use the ones that I’ve hosted, which are located at http://ja.meswilson.com/blog/weatherimages/
You can edit ‘Widget Formatting’ to change how the info is displayed. To access the variables, use this formatting:
- %loc% – Location
- %temp% – Current temperature
- %feels% – Feels like temperature
- %icon% – The icon referring to the current weather. This is just a number
- %iconhref% – The location of the image with your set image location at the front
- %attribution% – The link supposedly required to be displayed. Weather data provided by weather.com®
The default formatting is:
<img src="%iconhref%" alt="%cond%" style="float:right;" />
<span style="font-size: 150%;">%temp% °F</span>
(%feels% °F)<br />
<span style="font-size: 65%; float: right;">%attribution%</a>