How to Embed a Weather Forecast on Your Website

Most weather widgets are designed for consumers — they show you NWS or commercial API data from a third-party source. You paste a script tag, you get a five-day temperature forecast, and your site now shows the same thing as every other weather widget on the internet.

That's not what indie forecasters need.

If you're making your own predictions — your own storm accumulation maps, your own timing calls, your own regional breakdown — what you actually need is a way to show your forecast on your own site. Not the NWS version. Yours.

Here's how to do that.

The difference between a weather widget and a forecast embed

A weather widget pulls live data from a third-party API (Weather.com, OpenWeatherMap, NWS). It's someone else's forecast rendered on your page.

A forecast embed is your own prediction, published to its own URL, shown as a live widget on your site.

The distinction matters for credibility. When you're building a readership around your specific forecasting voice and track record, "showing NWS data" doesn't differentiate you. Showing your prediction — your map, your numbers — does.

How ForecasterHQ's embed widget works

Every forecast you publish on ForecasterHQ gets its own URL and a corresponding embed code.

The embed is an <iframe> snippet you drop into any page that supports HTML — a WordPress post, a Squarespace section, a Ghost article, a custom site. The widget renders your forecast card with:

Your map with prediction regions
Your accumulation ranges or weather data per region
Your timing window
Your forecaster name and link back to your profile

It's branded to your forecast, not to ForecasterHQ. When a reader sees it embedded in your blog, they see your work.

The embed updates live — if you adjust a forecast before the event window closes, the embedded version reflects the update automatically.

Getting your embed code

Publish a forecast on ForecasterHQ
Open the forecast's detail page
Click the Share button and select Embed
Copy the <iframe> snippet

The snippet looks like:

Paste it anywhere HTML is accepted. The widget is responsive and will scale to fit your content column width.

Where forecasters use the embed

Blog posts: Embed your forecast at the top of a storm preview post, then reference it throughout the article. Your readers can interact with the map while reading your breakdown.

Local weather pages: If you run a dedicated website for your geography, a pinned embed of your latest forecast is the most useful thing you can put on the homepage.

Email newsletters: Most email clients don't support <iframe>, but you can screenshot the embed and link it to the full forecast URL. Subject line: "My call for Tuesday's storm [link to full forecast]."

Community sites and forums: Some platforms (Squarespace, Webflow, certain WordPress installs) let you drop raw HTML. Embed your forecast directly in a community pinned post.

Why not just post a screenshot?

Screenshots work. But they have real limitations:

They go stale immediately — the map you posted is the map from when you posted it
They're not interactive — readers can't hover regions to see values
They don't link back to your forecast with full context
They don't capture your forecast evolving as an event approaches

An embed is a live document. A screenshot is a printout.

What about generic weather APIs?

If your goal is to show observed conditions or third-party forecast data on a weather site you're building, a generic weather API (OpenWeatherMap, WeatherAPI, Pirate Weather) is the right tool. There are good free and low-cost tiers, and many support basic widget generation.

But that use case is different from publishing original predictions. If you're a forecaster making your own calls, a generic API widget shows someone else's forecast under your brand. That's a credibility problem, not a solution to one.

Use weather API widgets when you need to show live conditions. Use forecast embeds when you need to show your prediction.

Getting started

You need a ForecasterHQ account to publish forecasts and generate embed codes.

Claim your page → — it's free to start. Once you've published your first forecast, the embed code is one click away from the Share menu.

If you run a weather blog, local site, or community page and want a live forecast widget that actually represents your own predictions, this is how you do it.