4WP Weather: Secure Gutenberg Weather Block for WordPress (OpenWeatherMap, Server-Side API)
4WP Weather adds a native Gutenberg weather block that shows current conditions on any page or post. Pick a provider, store your OpenWeatherMap API key in WordPress — never in the browser — and let the plugin fetch data through its own REST endpoint with server-side caching. Built for developers and site owners who want a weather widget without exposing API keys, adding tracking scripts, or pulling in a heavyweight forecast suite.
A Weather Widget for WordPress That Keeps Your API Key on the Server
Most WordPress weather widgets fetch forecast data directly from the browser, which means your OpenWeatherMap API key — or whichever provider you use — ends up visible in the page source, JavaScript bundle, or network tab. Anyone can copy it, use it on their own site, and burn through your request quota.
4WP Weather avoids that entirely. The Gutenberg block calls a local REST API endpoint (forwp-weather/v1/weather), and PHP performs the actual request to OpenWeatherMap server-side. The visitor’s browser never sees your key. Responses are cached using WordPress transients, so repeat page views don’t trigger repeat API calls — keeping you comfortably inside free-tier rate limits.
Who 4WP Weather Is For
- Developers and agencies who need a lightweight current-conditions block without bundling a full weather plugin suite with maps, widgets, and shortcodes they won’t use
- Security-conscious site owners who don’t want third-party API keys exposed in browser requests or page source
- Local businesses, travel sites, and event pages that want to show current weather for a single location alongside their content
- SEO-focused publishers who want optional JSON-LD weather structured data on public pages without manually writing schema markup
How the 4WP Weather Block Works
- Install and activate 4WP Weather.
- Open 4WP Weather → Providers in the admin menu.
- Select a provider (currently OpenWeatherMap) and paste your API key, then save.
- Add the 4WP Weather block (
forwp/weather) to any page or post. - Set a location using coordinates, a city name, browser geolocation, or a configured default — and preview it live in the admin.
- Optionally enable JSON-LD structured data under Documentation for public pages.
Key Features
- Native Gutenberg block (
forwp/weather) — no shortcodes, no widget areas, no page-builder add-ons required - Server-side API requests — the API key is stored as a WordPress option and never reaches front-end HTML or JavaScript
- React-powered admin with a Providers screen (API key + live preview) and built-in Documentation
- OpenWeatherMap Current Weather API support, with additional providers on the roadmap
- Optional JSON-LD (
Observationschema) for current conditions on public pages - WP-CLI support — run
wp forwp-weather flush-cacheto clear cached responses
4WP Weather vs. Other WordPress Weather Plugins
Most WordPress weather widget plugins compete on the number of layouts, map providers, and forecast days they support. 4WP Weather takes the opposite approach: a single, secure, developer-friendly Gutenberg block focused on current conditions. Here’s how it compares to popular weather widget and forecast plugins.
| Feature | 4WP Weather | Typical “all-in-one” weather widget plugins |
|---|---|---|
| API key exposure | Server-side only — never sent to the browser | Often client-side, visible in requests or page source |
| Editor experience | Native Gutenberg block with live admin preview | Shortcodes, classic widgets, or page-builder elements (Elementor, WPBakery, etc.) |
| Forecast scope | Current conditions, focused and lightweight | Multi-day/hourly forecasts, maps, multiple layouts and icon themes |
| Structured data (SEO) | Optional JSON-LD Observation schema built in | Rarely included; usually requires a separate SEO plugin |
| Caching | Server-side via WordPress transients, plus WP-CLI cache flush | Varies by plugin; some cache, some call the API on every load |
| Pricing model | Free, open source | Often freemium, with maps and extra layouts behind a paid tier |
If you need detailed multi-day forecasts, interactive maps, or dozens of layout templates, a larger weather widget plugin may suit you better. If you want one clean current-conditions block, a secure server-side key, and optional schema markup — without the extra surface area — that’s exactly what 4WP Weather is built for.
Privacy and External Services
4WP Weather connects to the OpenWeatherMap Current Weather API to retrieve the data shown in the weather block, the admin live preview, and the optional JSON-LD output.
When a visitor loads a page containing the block — or when an administrator uses the live preview — WordPress sends a server-side HTTPS request to https://api.openweathermap.org/data/2.5/weather. This request includes your stored API key as the appid parameter, plus either geographic coordinates (lat/lon) from the block settings or browser geolocation (with visitor permission), a configured default location, or a city name (q) if you use text-based locations.
4WP Weather does not send visitor IP addresses as part of the API request. OpenWeatherMap may log requests according to its own policies. Responses are cached on your server to reduce repeat calls. This service is provided by OpenWeather Ltd. — see their terms of use and privacy policy.
Installation
- Upload the plugin to
/wp-content/plugins/4wp-weather/, or install it directly from the Plugins screen. - Activate 4WP Weather.
- Open 4WP Weather in the admin menu → Providers, set your provider and API key, then save.
- Insert the 4WP Weather block on any page or post and configure its location settings.
Requirements
| WordPress version | 6.4 or higher |
| PHP version | 7.4 or higher |
| Tested up to | WordPress 7.0 |
| Current version | 1.0.0 |
| Requires an API key | Yes — free OpenWeatherMap account and API key |
Frequently Asked Questions
Does the OpenWeatherMap API key appear in the browser?
No. Only WordPress communicates with the weather API using the stored key. The Gutenberg block calls a local REST endpoint, and PHP performs the actual request server-side — the key never reaches front-end HTML or JavaScript.
Is JSON-LD structured data required?
No. You can enable it under Documentation if you want structured weather data on public pages. Enabling JSON-LD does not guarantee rich results in search engines — that depends on the search engine itself.
Which weather providers does 4WP Weather support?
OpenWeatherMap is live today. The plugin is built with a pluggable provider architecture, and additional providers are registered as roadmap stubs for future releases.
Does 4WP Weather show multi-day or hourly forecasts?
The current release focuses on current conditions via the OpenWeatherMap Current Weather API. If you need detailed multi-day or hourly forecasts and map layers, a dedicated forecast plugin may be a better fit — 4WP Weather is intentionally scoped to a single, secure current-conditions block.
How does caching work?
Responses from OpenWeatherMap are cached on your server using WordPress transients, so repeat page views don’t trigger repeat API calls. Administrators can clear the cache manually with the WP-CLI command wp forwp-weather flush-cache.
Do I need to write custom code to set a location?
No. Set a location directly in the block settings using coordinates, a city name, a configured default, or — if the visitor allows it — browser geolocation. No custom PHP or JavaScript is required for standard use.
Need a Custom Weather Provider or Gutenberg Block Built?
4WP Weather ships with OpenWeatherMap support and a pluggable provider architecture designed for extension. If your project needs a custom weather data provider (a different API, an internal data source, or a paid forecast service), a custom Gutenberg block built around your design system, or a broader WordPress plugin development engagement following SOLID and DDD architecture, 4wpdev builds exactly that. See our approach to WordPress plugin architecture at 4wp.dev, or get in touch through the 4wp.dev plugin page.
More Plugins from 4wpdev
4WP Weather is part of a growing set of WordPress tools built by 4wpdev, including 4WP Drive for importing Google Docs into WordPress as drafts, and 4WP Style Switcher for dark mode and style variation switching on block themes. See the full list on the 4wpdev WordPress.org profile.
Development and Contributing
4WP Weather is open source. The full source and release history are available in the public GitHub repository. JavaScript and CSS are built with @wordpress/scripts; the plugin ZIP includes human-readable source (src/, package.json, webpack.config.js) alongside the compiled build/ directory, and the same tree is mirrored on GitHub for development and releases.
To build from source: cd into the plugin directory, run npm install, then npm run build — this outputs build/weather/ and build/admin/.
“4WP” is our project brand name — “WP” appears only as part of that name and is not a reference to WordPress. This plugin is not affiliated with, endorsed, or sponsored by WordPress.