How to Embed an RSS Feed in Your Web Page
How to Embed a Google Map with iFrame
How to Add Buttons to an HTML5 Form

How to Embed the Weather Forecast in Your Website

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:


Go to the Weather Underground site.

Enter your ZIP code in the search box.


Click the Get Free Weather Stickers link.

Choose one of the three versions of the sticker.


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

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


Add, 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.

blog comments powered by Disqus
How to Construct a Checkbox in Your HTML5 Form
How to Test PHP in a Server
How to Create a Drop-Down List in an HTML5 Form
Attributes of New Form Elements in HTML5
How to Put Text Boxes in an HTML5 Form