Forecast Blog Developers Contact

By Adam Grossman on June 3, 2013.

We’ve received a bunch of requests from users who want a simple, attractive, weather widget that can be easily embedded on their websites. So today we’re releasing the first Forecast Embed, a concise little display of current conditions, the weekly forecast, and weather alerts (if any) for whatever location you specify. See the example above.

It’s easy to use. Just plop this code into your HTML:

<iframe id="forecast_embed" type="text/html" frameborder="0" height="245" width="100%" src="http://forecast.io/embed/#lat=42.3583&lon=-71.0603&name=Downtown Boston"> </iframe>

The embed takes a few parameters (marked in red): the longitude and latitude of the point you want the forecast for, the name of the location as you want it to appear at the top of the embed, and the width of the embed (which can either be in pixels or percentage). The height is fixed at 245px.

You can find the latitude and longitude of most locations using a tool like itouchmap.

Optional Parameters

There are also a few of optional parameters, marked in blue:

<iframe id="forecast_embed" type="text/html" frameborder="0" height="245" width="100%" src="http://forecast.io/embed/#lat=42.3583&lon=-71.0603&name=Downtown Boston&color=#00aaff&font=Georgia&units=uk"> </iframe>

You can change the font from the default Helvetica, the color of the temperature bars, and the localization of the units (‘us’ for Fahrenheit and mph, ‘uk’ for Celsius and mph, ‘ca’ for Celsius and km/h, and ‘si’ for Celsius and m/s).

That’s it. Use of the embed is absolutely free. If you use it, maybe send us a link so we can check it out!

Enjoy!

“Gears 3″ image by Adam Brill