Pro Weather· Updated
How to Embed Live Weather Data on Your Website or Blog
The fastest way to embed live weather data on a website or blog is an iframe widget: one snippet of HTML that displays your station's current conditions and keeps itself up to date. Paste it into any platform that accepts custom HTML — WordPress, Squarespace, Wix, Ghost, Google Sites — and you are done.
Once you have your Davis weather station online, you might want to show its live data somewhere else: a community club page, a school science website, a local news blog, or your personal homepage. Embedding live weather makes your site more useful for local visitors and gives your station a wider audience. This guide covers three approaches, from simplest to most customizable.
Option 1: The simple link
The easiest way to share your weather data is a direct link to your station's page. It is not an embed, but it works everywhere and requires no technical setup.
If you use Pro Weather, your site lives at a URL like yourcity.pro-weather.com or your own custom domain. You can simply link to it:
<a href="https://yourcity.pro-weather.com">Live weather in Your City</a>This is the approach for sites that do not support iframes or JavaScript embeds (some email newsletters, static site generators, or forums).
Option 2: An embeddable weather widget
An iframe is the most reliable way to embed live weather on any site that supports HTML. Pro Weather generates an embed URL that displays your current conditions in a compact, responsive widget.
The embed code looks like this:
<iframe src="https://yourcity.pro-weather.com/embed"
width="100%" height="400"
frameborder="0"
title="Live weather for Your City">
</iframe>Place this wherever your site or blogging platform accepts custom HTML, and it will display your current temperature, humidity, wind, and conditions in a self-contained box. The embed updates automatically alongside your main site, so there is no extra data feed to maintain.
How do you add the weather embed to WordPress, Squarespace, or Google Sites?
Every major platform has a block that accepts raw HTML. In WordPress, paste the iframe into a Custom HTML block. In Squarespace, use an Embed block in code-snippet mode. In Google Sites, choose Insert → Embed → By code. Wix and Ghost have equivalent embed elements. No plugin is needed on any of them.
| Platform | Where to paste the iframe |
|---|---|
| WordPress (block editor) | Add a Custom HTML block and paste the snippet |
| Squarespace | Add an Embed block and switch it to code-snippet mode (or a Code block if your plan includes it) |
| Wix | Add → Embed code → Embed HTML |
| Google Sites | Insert → Embed → "By code" |
| Ghost | Add an HTML card in the post editor |
Two practical tips. First, keep the width="100%" attribute so the widget adapts to whatever column it sits in, and adjust height to taste. Second, if your page is served over HTTPS (almost all are), the embed URL must be HTTPS too — Pro Weather embeds always are, so this only matters if you host the widget source yourself.
Option 3: The WeatherLink API (most flexible)
If you want full control over how your weather data is displayed, you can fetch it directly from the WeatherLink v2 API and render it yourself. This requires some development work but gives you complete freedom over the design. You will need API credentials first — here is how to generate a WeatherLink API key.
The API returns JSON with current conditions, so you can build a custom widget, a weather bar in your site header, or a full dashboard page. You will need to handle the API key securely and set up a small backend proxy or use client-side JavaScript if you are comfortable exposing the key for read-only data.
// Example: fetch current conditions from WeatherLink v2 API.
// The station ID comes from a one-time call to /v2/stations.
const response = await fetch(
'https://api.weatherlink.com/v2/current/YOUR_STATION_ID?api-key=YOUR_KEY',
{ headers: { 'X-Api-Secret': 'YOUR_SECRET' } }
);
const data = await response.json();This approach works well for developers who want a custom embedded display, but it shifts the maintenance of the data pipeline to you.
Which option should you use?
Use the iframe embed unless you have a specific reason not to. It shows live data, requires no ongoing maintenance, works on any platform that accepts HTML, and updates every 10 minutes alongside your main site. Fall back to a plain link where iframes are blocked, and reach for the API only if you want a fully custom display.
- Just want to share a link → Option 1, a simple hyperlink.
- Want live weather in a blog sidebar or club page → Option 2, the iframe embed. It is set-and-forget.
- Want a completely custom display → Option 3, the API. Only if you are comfortable with code.
Common questions
Can I embed my WeatherLink data in WordPress?
Yes. WeatherLink's own dashboard is designed to be viewed on weatherlink.com rather than embedded elsewhere, but a site built on your WeatherLink data can be embedded anywhere. With Pro Weather, add a Custom HTML block in the WordPress editor and paste the /embed iframe snippet — your current conditions appear in a responsive box that updates automatically. No WordPress plugin is required.
Is an iframe bad for my site's SEO?
No. Search engines treat iframe content as belonging to the source site, so it neither passes ranking problems to your page nor drains anything from it. Best practice is simply to give the iframe a descriptive title attribute and avoid putting content that must rank for your own page inside a frame — a weather widget is supplementary content, which is exactly what iframes are for.
How often does the embedded widget update?
The embed shows the same data as your main weather site, which refreshes every 10 minutes from your station via the WeatherLink API. Anyone loading or reloading the page sees the latest reading. There is no separate feed to configure or keep alive — if your station is reporting, the embed is current.
Can I embed live weather without an iframe?
Yes, but it means writing code. Fetching from the WeatherLink v2 API (Option 3) lets you render the data any way you like — a header bar, a chart, a custom card — at the cost of building and maintaining that integration yourself. For a no-code display inside an existing page, the iframe remains the practical answer.
Getting started
If you have a Davis station and want an embeddable weather widget, the first step is getting your data online. Start a Pro Weather site and your embed URL will be ready in about five minutes. See the setup guide for details.
Embedding puts your data on pages you control. If you also want your readings on the big public networks, see how to send your station data to Weather Underground and CWOP — the two approaches work happily side by side.