How to Embed the Weather Forecast in Your Website - dummies

How to Embed the Weather Forecast in Your Website

By David Karlins, Doug Sahlin

The Weather Underground site provides an embeddable weather forecast sticker (a small box that displays the weather for a selected area) you can embed in your page. The technology is super-simple. You get the HTML code to embed an image that Weather Underground updates periodically with your ZIP code’s weather forecast.

This example is almost too simple, but it’s very useful and provides a good experience with the most basic form of embedded live content — an embedded image that someone else updates.

Here’s how you place that sticker on your site:

1Go to the Weather Underground site.

Enter your ZIP code in the search box.

2Click the Get Free Weather Stickers link.

Choose one of the three versions of the sticker.

3Copy the generated HTML and paste it into your web page.

There are three versions of the weather sticker, the only difference being the design.

4Add, edit, and fine-tune your own HTML and CSS so that the weather sticker “fits in” to your page seamlessly.

The weather sticker is embedded in a page with associated content. And, of course, the weather info itself will be updated by the folks at Weather Underground.