Under The Weather

Install the Under The Weather Plugin using one of two common methods. From the WordPress Plugin Directory:

1. Log in to your WordPress Admin Dashboard.
2. Navigate to Plugins > Add Plugin in the left-hand menu.
3. Search for the plugin: Under The Weather.
4. Install the plugin: Once you locate the correct plugin, click the "Install Now" button next to it.
5. Activate the plugin: After the installation is complete, click the "Activate Plugin" button that appears.
6. Navigate to Settings > Under The Weather to configure the plugin. You must enter a valid OpenWeather API key for the plugin to function. The plugin is designed to work with OpenWeather's One Call API 3.0 or 4.0. From a Zip File:
7. Download a copy of the plugin, available in the WordPress Plugin Directory Under The Weather webpage.
8. Upload the entire under-the-weather folder to the /wp-content/plugins/ directory.
9. Activate the plugin through the 'Plugins' menu in WordPress.
10. Navigate to Settings > Under The Weather to configure the plugin. You must enter a valid OpenWeather API key for the plugin to function. The plugin is designed to work with OpenWeather's One Call API 3.0 or 4.0.

This plugin works with both the OpenWeather One Call API 3.0 and the newer One Call API 4.0. You can get a free API key by signing up on the OpenWeather website. Ensure you have subscribed to the "One Call by Call" subscription on your account's API page. Both 3.0 and 4.0 share the same standard API key and operate under the exact same 1,000 free calls per day limit.

OpenWeatherMap currently offers two versions of the One Call API. You can use either version, but you must ensure your OpenWeather account is subscribed to the specific version you select.

• Use One Call API 3.0 (Recommended for Efficiency): While OpenWeatherMap marks this as "deprecated," it is still available to users. Because version 3.0 packages current conditions, daily forecasts, and alerts into a single response, it consumes fewer API hits than the modular 4.0 architecture. Sticking with 3.0 is recommended for users looking to stretch their 1,000 free daily calls as far as possible.
• Use One Call API 4.0: This is OpenWeatherMap's newest standard. Use this if you already have an active 4.0 subscription. Because 4.0 requires multiple endpoint requests to gather the same data, it will consume your 1,000 free daily API calls faster than 3.0. If you select One Call 4.0 and want to protect your free tier limit, consider setting a higher Cache Expiration Time.

This most commonly occurs when there is an issue with your OpenWeather API subscription. Please check the following:

1. API Plan: Ensure you have subscribed to the "One Call API" specifically. Other free plans (like "Current Weather") are not compatible with this plugin.
2. Payment Info: OpenWeather requires a valid credit card on file for the One Call plan. Although the first 1,000 calls per day are free, the API will return an error if no payment method is registered.
3. Activation Time: New API keys can take up to 2 hours to become fully active.
4. Performance Report: Go to Settings > Under The Weather > Performance Report to view the "Raw Data" section for the specific error code (e.g., 401 or 402) returned by the server.

Click on the "Performance Report" tab on the Under The Weather Settings Page to compare cached hits and OpenWeather API calls requested by the weather widgets. A graph and data log for the last 7 days of plugin performance show how the plugin's cache system effectively reduces the number of API calls. Use the Performance Report to examine how modifying the cache expiration time affects the rate of cached requests.

No. Under The Weather uses a shared, server-side caching key generated from the location name and unit system. Once weather data is fetched and cached for a location (e.g., "Los Angeles, CA"), every widget across your entire site that uses that exact location name will serve from that identical cache until it expires. This allows you to display forecasts across dozens of posts or sidebar areas while consuming only a single API request.

No. To retrieve fresh weather data every time a widget page loads, you can uncheck "Enable Cache" under the plugin's advanced settings. The caching system greatly reduces API hits, but turning this function off during your initial widget setup may be useful.

Cinderella's magic disappears at midnight and weather caches expire at midnight too. Visitors should never see a cache of the previous day's forecast. For example, if you set the cache expiration time to 8 hours and a weather cache is created at 10 p.m., that cache will expire at midnight, and someone visiting the site the next day at 5 a.m. will not see the previous day's cache even though fewer than 8 hours have passed. To ensure your visitors never see yesterday's weather, the plugin calculates the time until midnight in the widget location's local timezone. Even if the cached forecast has not been saved for as long as the max duration set by the "Cache Expiration Time" slider, the cache will expire at midnight.

The plugin caches the weather data on your server to improve performance and reduce API calls. The data will only be fetched again after the "Cache Expiration Time" you set on the settings page has passed. If you need to force an immediate update, go to Settings > Under The Weather and click the "Clear All Weather Caches" button.

The weather widget is probably displaying a cached forecast. Since waiting around is no fun, the Under The Weather Settings has a "Clear Weather Cache" option at the bottom. If you press the "Clear All Weather Caches & Stats" button, it will force an immediate update of all weather forecasts. This will also clear the performance report data. If you're feeling patient, just wait for the weather widget to update after the current cache has expired.

By default, the weather widget displays the forecast in Fahrenheit. If you prefer to see the forecast in Celsius, set data-unit="metric" within the weather-widget div (see configuration instructions). Checking the "Display Unit Symbol" box on the Under The Weather Settings page instructs the weather widget to display the temperature unit symbol (F or C) in the primary temperature display. Enabling the "Unit Toggle Switch" allows visitors to switch back and forth between Fahrenheit and Celsius.

The plugin offers two methods for looking up coordinates using its built-in Coordinate Finder tool:

• In the Settings Page: Navigate to Settings > Under The Weather and click the Coordinate Finder tab. Simply type in a location name, and the tool will look up the coordinates and provide you with the exact <div> code to copy and paste.
• In the Editor: While using the Under The Weather Forecast block, click on the Find Coordinates By Name button. The coordinates for your chosen location will be filled in for you automatically.

In the WordPress block editor, simply search for "Under The Weather Forecast" when adding a new block. The block includes a built-in coordinate finder, so you can search for locations by name rather than manually entering latitude and longitude. Configure your preferences in the block settings sidebar, and the weather will appear automatically on your published page.

Absolutely! While the block is the user-friendly method for the modern WordPress editor, the plugin fully supports traditional methods for maximum flexibility. You can use the [under_the_weather] shortcode to easily place the widget in the Classic Editor, text widgets, or with various page builders. Additionally, the manual <div> method still works perfectly. It is particularly useful for theme developers who need to integrate the widget directly into template files or dynamically populate its data from custom fields. The traditional method of adding <div class="weather-widget"> with data attributes still works perfectly and is particularly useful for theme developers and sites that dynamically populate widget attributes from post meta or custom fields.

The recommended and most reliable format for coordinates is Decimal Degrees (DD), for example: 34.1195, -118.3005. However, the Under The Weather Forecast block is designed to be user-friendly. If you enter coordinates in other common formats like DMS (e.g., 34°07'10.2"N) or DDM (e.g., 34° 7.17' N), the block will automatically convert them to the correct decimal format for you. For the manual <div> method, it is strongly recommended to use Decimal Degrees. The front-end script has a fallback to parse other formats, but some characters (like the " symbol in DMS) can break the HTML structure and lead to incorrect coordinates. The block editor's converter is the most reliable way to handle alternate formats. If you're unsure what coordinates to use, the Coordinate Finder tool will retrieve accurate coordinates in the correct format.

The alerts are provided directly by the OpenWeather API, which sources them from official meteorological agencies in each country. This ensures the information is timely and authoritative.

That shimmering animation is a structural placeholder. It reserves the vertical space the weather data will need before the forecast finishes downloading from the server. This prevents the text and images on your page from suddenly jumping down when the widget loads, helping prevent Cumulative Layout Shift (CLS) and protecting your site's SEO and Core Web Vitals scores. If you prefer a completely transparent space instead of the animation, you can uncheck the "Shimmer while loading" box in the plugin's Advanced Settings. Vertical space for the weather data will still be reserved.

This is a security feature that limits the number of times a single visitor (identified by their IP address) can request weather data in one hour. Enabling it helps protect your OpenWeather API key from being overused by automated bots or malicious users. For most websites, the default limit of 100 requests per hour is generous, but you can adjust it if needed. The rate limit is turned off by default to ensure maximum performance for all users. If you notice an unexpected increase in weather requests in the performance report, go ahead and turn on rate limiting to see if something is afoot.

This setting (found in Advanced Settings) optimizes how the plugin's stylesheets are loaded to improve your website's speed scores (like Google PageSpeed Insights). By loading the CSS asynchronously, the plugin prevents "Render Blocking," meaning the browser doesn't pause painting your page to wait for the weather styles to download. Important Considerations:

• Above the Fold: It is recommended to leave this unchecked if your weather widget is located near the top of the page.
• Layout Shifts: On some sites, async loading can cause a brief "flash of unstyled content" (FOUC) or Cumulative Layout Shift (CLS) where the widget collapses or appears unstyled for a fraction of a second before popping into place.
• The Fix: If you choose to enable async loading, we highly recommend adding a standard min-height rule (e.g., min-height: 300px;) for the .weather-widget class to your WordPress theme's custom CSS. This reserves the widget's vertical space while the stylesheet downloads in the background. If you still find the loading sequence visually distracting, simply uncheck "Async CSS Loading" to revert to the standard loading method.

Yes. By default, when "Load Plugin JavaScript" is selected, it will add scripts to every page of your website. If you only plan to display the weather widget on select pages, you could choose to only load the Under The Weather Scripts on those pages by encoding the JavaScript yourself. When Load Plugin JavaScript is unchecked, you can use this template tag to add the Under The Weather Scripts to your theme's footer.php file. ` ` For example, if you only intend to display the weather widget on events pages, you could add this targeted script to your theme's footer.php file: ` ` Adding scripts this way is purely optional. Most users can just leave the Load Plugin JavaScript box checked.

Yes. You can modify the appearance of the Weather Icons Fonts using CSS. The Weather Icons Fonts are sharp, scalable, and customizable via CSS to match your website's color palette.