Industry guru Dave Taylor offers tech support on technical and business topics, including iPhone, iPod, Microsoft Windows, Sony PSP, cellphones, online advertising, CSS, Web design, business, Unix, Linux, SEO, Mac OS X, and shell script programming.     


How do I add current weather to my website?

I have a new Web site and I'd really like to be able to add a little weather "bug" to it so people can check on the weather in my neighborhood. I've looked at some sites that offer weather forecasts but am completely befuddled. How do I add a weather forecast box to my Web site?


Dave's Answer:

This is a fun question, and having dug around for a bit, I can see what you mean. Sheesh, there are some highly, highly technical solutions out there. However, there are also some pretty easy forecasts you can get from sites like Weather.com...

The two solutions that seem the easiest are from Weather.com and from Weather Reports.com. Let's look at each.

Weather.com

The site's overrun with advertising, but I have to admit that the little weather "bug" they make available for you to add to your own site - free - is darn attractive:

The greatest reservation I have recommending this one is that you have to sign up for it, including a required mailing address and date of birth. Um, this is just a weather bug, guys, why do you need to know my age? Anyway, sign up and it'll eventually give you a simple script-based line of code. Couldn't be easier:

<script src='http://voap.weather.com/weather/oap/USCO0038?
template=LAWNH&par=null&unit=0&key=23b21baeda744bc2b22d51bf2ed5b2bd'>
</script>

Obviously, the region code and such are encoded in the "key", but the template value can be changed for different looks, if you're so inclined. Nothing an enthused reverse engineer person couldn't do. :-)

Weather Reports.com

The other site I've found that has weather you can drop on your site is WeatherReports.com. Their format is a lot easier to work with and they don't require any sort of signup.

Here's what one of their code blocks look like (they have six different template sizes):

The code underlying that is very similar to the Weather.com snippet:

<script type="text/javascript" language="javascript1.2" src="http://weatherreports.com/jscript.html?width=234&height=60&theme=lblue&location=Boulder%2C%20CO&units=f">
</script>
<div><a href="http://www.weatherreports.com/">
<small>WeatherReports.com</small></a></div>

You can learn more about their service, including exact details of configuration and more, all at Add Weather to your Site.

For people outside of the United States, there are fewer options, but one notable alternative is WeatherZone, focused on Australia. Another nice, elegant weather bug you can add to your site.


More Useful HTML, JavaScript and Web Site Programming Articles:
✔   How to Create Predefined Google Image Search Links?
Thanks for the Amazon URL [see Creating Amazon Search Links]. That worked beautifully. In fact, I sent you $5.00 for coffee in thanks....
✔   Can I embed a Facebook search box on my blog site?
I've seen your articles about how to add a Twitter or Google search box on a Web page, but I have a tougher...
✔   Can I use CSS for drop shadows on my blog?
I want to give my site a bit of a facelift and add some neat graphical elements. One of which is drop shadows....
✔   How can I embed interactive photo panoramas on my site/blog?
I read through your blog entry about how to take panoramic photos with iOS 6 and an iPhone 5 and got enthused. I've...
✔   How can I create a Twitter search URL shortcut?
I'd like to add a few Twitter search links to my Web site. Is that possible, or does Twitter prohibit this sort of...

Let's stay in touch!
Sign up for my weekly AskDaveTaylor Newsletter and you'll receive even more tech and gadget help right to your inbox, along with exclusive news and industry updates. It's good stuff. I promise!
    Enter your name: and your email addr:  









Reader Comments To Date: 46

Bryan Price said, on December 16, 2005 1:28 AM:

I use weather pixie (http://weatherpixie.com/)

No need to give out your first born. It's pretty cute, you can choose an avatar in various dress, and it works internationally. I use if for Florida, Afghanistan and Germany (the last two where my eldest are doing the soldier thing as MPs.)

Gary B. said, on December 1, 2006 1:34 PM:

Dave, I have a small weather web page on my website. I want to be able to have special weather statements scroll across the top of my web page. I've tried about every free thing I can find and can't even find it on a lot of pay things. Can you help me and can you respond my email as I'm not on my home puter and may not easily find your page again. Thanks

Adam said, on December 7, 2006 2:19 PM:

I am also trying to add weather posts to my web site, I will pull the address from a php script so It will be displayed when a golf course is searched.
does anybody know of the best solution.
Golf Community

golf community said, on December 7, 2006 2:25 PM:

I am also trying to add weather posts to my web site, I will pull the address from a php script so It will be displayed when a golf course is searched.
does anybody know of the best solution.
Golf Community

Becky Bear said, on January 6, 2007 7:52 PM:

I love weather underground (the original weather site). http://www.wunderground.com/ They offer a variety of very attractive weather stickers calibrated to your zip code. Their pages could use a bit of a reworking for clarity, but if you type in your zip at the top of the page, get the forecast for your area, then scroll to just below the moon phases chart they will offer you free weather stickers for your web pages. When you click on that offer you are taken to a page with multiple styles of stickers. Click on the style you want and you will be provided the HTML to paste on your website.

Wes H said, on March 12, 2007 7:52 AM:

Thanks for the tips about Weather Bug!

WW.

web boy said, on April 28, 2007 1:39 AM:

thanks man!

Jewels said, on June 5, 2007 12:43 PM:

Any idea how to get these same weather bugs into an html e-mail? I've tried the weather.com one and the weatherreports.com one. They work fine online, but when I put the same html in an e-mail, it doesn't show up.

Grant said, on June 7, 2007 4:52 PM:

iBegin offers the most generic, simple, attractive website widget

http://weather.ibegin.com/widget/

try them, it's easy and they don't ask for any personal info beyond a zip code

HTH

Bhavin said, on July 10, 2007 10:28 AM:

I am tired searching for easy to deployable weather components on my site. At present i am using http://www.4wx.com/weather.php? on my site. This works fine for valid zip code but if i enter wrong zipcode it shows only blank image, there is no validation on site. I am looking for generic weather component / utility which i can simply place on my site and if entered wrong zip code it will return me a message result for not found record,

If anyone have idea please let me know.

DJ said, on July 30, 2007 2:00 AM:

Hi Grant,

Thanks for the iBegin tip. This works great. No advertizing, just what you want: weather info. AND it's customizable.

Cheers
DJ

Midgard said, on July 31, 2007 4:56 AM:

What is bad, there is no good widgets for Russia... (((

Ray said, on August 27, 2007 6:37 AM:

Does any body knows any Europe weather forecast widgets? This ones great (http://weather.ibegin.com/widget/), but shows only in F, i need in C ;(.

coone said, on September 14, 2007 10:37 AM:

Easy,some chinese sites have free weather forecasts and hey don't ask for any personal info.

http://weather.china.com.cn/cityshow.html?city=58423&sheng=12&citys=58423&Submit=%E9%80%89%E3%80%80%E6%8B%A9

Bob said, on October 6, 2007 10:20 AM:

Thanks for the tip Dave.

heepie said, on October 8, 2007 11:31 AM:

You can always go to places like:

widgetbox.com

They have a range of widgets for everybody. Or you could always make your own.... LOL

heepie said, on October 8, 2007 11:42 AM:

If you want to make your own this link may help:

http://www.aspnetresources.com/articles/weather_server_control.aspx

Ray said, on October 15, 2007 12:09 PM:

Thanks for advice m8s!

stefan said, on October 19, 2007 7:34 AM:

Hi Dave!
How do I add flight searching to my website?
s..-

Michelle said, on October 22, 2007 11:59 AM:

I found a great, free way to add weather to your Web site: http://weather.weatherbug.com/desktop-weather/web-widgets.html

WeatherBug gives you the LIVE weather and it's LOCAL so you get to pick a station, likely one close by. The one for my neighborhood is literally around the corner from my house!! Love it!

Jermayn said, on May 2, 2008 1:05 AM:

Weatherzone for aussie looks great!
Thanks for this...

Need it for a new website (click my name) and this is excatly what I am after!

JP Singh said, on June 3, 2008 8:18 AM:

Hi, is there any service which lets you to fetch temperature in textual format and then you can simply mention the temprature on webpage.

James Cullom said, on August 25, 2008 10:13 AM:

The weather script does not show on a mac I build the web pages with a mac and page spinner. It works on my computer and Safari if I click on the document but not over the net

dave said, on October 29, 2008 4:52 PM:

This page has some great aftermarket ideas that are overloaded with advertising.
BACK to the original question that did not have an answer.......
How about a way to get the forecast using the weather service and not an aftermarket advertising driven site.

denn said, on October 31, 2008 9:30 AM:

I use weather pixie (http://weatherpixie.com/)

Azhar Hussain said, on December 29, 2008 7:40 AM:

Azhar.in

fedexx said, on January 14, 2009 8:56 AM:

hey guys, i found one that is pretty nice. its weather world wide, nice, simple. If it supported more languages would be perfect. hope u like it, enjoy

http://www.widgetbox.com/widget/weather2

thx dave, your karma count is off the roof hahaha

Porter said, on January 17, 2009 3:43 PM:

I'm trying to do something similar, but am looking for a hardware-to-software-to-website temperature-monitoring solution that will automatically update on my website.
I can not use any of the existing weather services to feed the data since there are none that actually cover my immediate area; I live in a small valley with its own microclimate, one that has vastly different temperatures from its neighbors. The temperatures here can differ 10-15 degrees from the village only a few miles away.
What I suppose I am specifically looking for is a setup that will monitor the weather outside my house, transmit that information to software on my computer, and then update on my website in real time.
Any advice?

John said, on February 21, 2009 4:57 PM:

This weather site has a cool & great looking widget:

http://www.weatherlet.com

Angela said, on June 25, 2009 4:46 PM:

A latte at Logan's for anyone who can point me to a weather widget or PHP code to pull in weather from NOAA via a lat/long coordinate. We live in Gold Hill, Colorado, and have a website for which we want to show the weather. Only NOAA has weather for Gold Hill. Gold Hill has same Zip as downtown Boulder, so regular NOAA widget doesn't work because it wants the Zip code. Neither does Weatherbug, Accuweather, etc.

Dick Coutu said, on October 19, 2009 6:23 AM:

October 19TH

Regarding: How do I add current weather to my website?

I love the one from weather.com for Colorado.

Would you have the key Colorado shown below:key=23b21baeda744bc2b22d51bf2ed5b2bd

for Rhode Island?

I have the region code [USRI0063] for RI.

I took yours and changed the region code.

Comes up fine in notepad [.html] file but when I put iton my website, I just get a bunch of garble.

Odds are it has to do with the key for the particular state.

weather.com does not have the one you have [backgrond selection] on their webiste.

Thanks!

Murugesan said, on November 12, 2009 4:46 AM:

Thanks for the info. I will implement this script in my site.

Jan said, on January 6, 2010 2:43 PM:

thanks for the weather info.. very usefull!

Mike R said, on January 20, 2010 3:35 AM:

Thanks Dave, we needed a weather feed for our golf site. We're having so much snow in the UK at the moment that we're all glued to the forecasts! Not that they get it right often...

scott bateman said, on January 27, 2010 7:29 PM:

My daughter is in Mongolia with the Peace Corps. What's the best weather widget to show her weather in Kashaat, Mongolia on her website? She has a Mac bought in March '09 with Leopard.
I'm looking for her as she only has internet when she gets to UB.
Thank you.

Dave Taylor said, on January 29, 2010 9:33 PM:

Scott, check out this set of weather widgets:

http://www.widgetbox.com/tag/weather

I would be surprised if none of them supported international weather forecasts and were easy to use. Good luck!

george said, on May 24, 2010 11:22 AM:

http://in.weather.yahoo.com/badge/intro/

Yahoo! is providing a nice cool weather widget Please try this.

Paul Scannell said, on June 4, 2010 9:22 AM:

This is a tremendous feature to add to a website. However, I have come across one small glitch. My particular town "North Providence, RI" doesn't fit nicely into the space provided. I tried to make the width a little larger, but that threw the plugin totally out of whack.

How do you get in touch with weather report to find out how to fix it?

CJ said, on August 28, 2010 11:58 AM:

I added the customized one from weather.com but only get the city in text with a hyperlink to weather.com...no graphics like they show on their website. I've tried IE and FF and neither displays the graphic. Any suggestions?

Chris said, on August 19, 2011 9:50 PM:

i have some radar on my website, www.chrisschild.com from google, but it has ads and i need some large screens that have nationwide live radar and look professional. Any ideas? im kinda new to this html code stuff so simple would be wonderful

Pradeep Kumar Guduru said, on August 21, 2011 12:08 PM:

Thanks for sharing useful information and i would like to implement on my site.

Aaron H. said, on January 30, 2012 8:05 PM:

Does anybody know of a weather widget which can be set to stream from any selected station on the NOAA Mesonet Observation Map?

JohnS said, on January 31, 2012 7:59 AM:

Hi,
I am using the weather widget from flashxml.net (http://www.flashxml.net/weather-widget.html). I like it because it's very customizable. You can even use your own icons for sun, clouds, etc. Trust me, worth to take a look at it.

drew said, on February 11, 2012 2:52 PM:

i have posted free scripts for a weather page at http://glassbala.com/phpweather.zip

the results of using the scripts can be seen at my page http://glassbala.com/fivemilefarm.php

included is grlevel3 application for the radar.

nick johm said, on April 28, 2012 5:47 AM:

networking to the world at this channel

daniel said, on August 3, 2012 12:58 AM:

Thank for the info it was very helpful, finally i can put a weather forecast on my site.. thanks

Starbucks coffee cup I do have a lot to say, and questions of my own for that matter, but first I'd like to say thank you, Dave, for all your helpful information by buying you a cup of coffee!

I do have a comment, now that you mention it!











I will never send you any unsolicited email. Ever.






Check This Out Too...

 
Look for Answers
Need Help? Ask Dave Taylor!


Follow Me on Pinterest

Find Me on Google+
ADT on G+
© 2002 - 2013 by Dave Taylor. All Rights Reserved.

Note: This web site is for the purpose of disseminating information for educational purposes, free of charge, for the benefit of all visitors. We take great care to provide quality information. However, we do not guarantee, and accept no legal liability whatsoever arising from or connected to, the accuracy, reliability, currency or completeness of any material contained on this web site or on any linked site. Further, please note that by submitting a question or comment you're agreeing to my terms of service, which are: you relinquish any subsequent rights of ownership to your material by submitting it on this site. My lawyer says "Thanks".
"Ask Dave Taylor®" is a registered trademark of Intuitive Systems, LLC.