Mat Gargano

statenweb

<p>Easy Weather Widget provides you with an easy to use widget which outputs weather information. When creating the widget just enter in your U.S. zip code and save, it will display the current weather on your site.</p>
<p>I completely rewrote the widget and made it filterable. You need to obtain and enter an API key, which has a free tier that should cover many use cases to obtain at Settings > General in your WP backend. See http://openweathermap.org/api for more information.</p>
<p>The following filters are available:</p>
<p><strong>eww_template</strong> to override the output template for the widget, see below for more information.</p>
<p><strong>note</strong>, if you are overriding the template, please heed the notice to comply with the OpneWeatherMap license which states <code>the OpenWeatherMap name must be mentioned as a weather source in a visible part of the application.</code> (obtained 8/2016 from http://openweathermap.org/price)</p>
<p><strong>eww_ioc_container</strong> to override the IoC container if you want to use different classes in the application (including the API to grab weather data)</p>
<h4>Usage of eww_template filter</h4>
<p>Add a “views” directory and file named “custom-eww.php” to your template directory. The “custom-eww.php” file will be your custom template for this example.</p>
<h4>Example of using a custom template from within your theme PHP 5.3+ which allows closures</h4>
<pre><code>    <?php

        add_filter( 'eww_template', function ( $template ){
            $template_dir = get_template_directory();
            return $template_dir . '/views/custom-eww.php';
        } );
        ?>
</code></pre>
<h4>Grunt</h4>
<p>This plugin takes advantage of Grunt for validating JavaScript, SASS compilation and minification. To take advantage of Grunt you have to have both <a href="https://npmjs.org/" rel="nofollow ugc">npm</a> and <a href="http://gruntjs.com/" rel="nofollow ugc">Grunt</a> installed. Visit the respective sites for the applications and make sure they are installed. Once installed, if you want to edit/fork this plugin, it will be helpful to be familiar with these two tools.</p>


Easy Weather Widget

Easy Weather Widget provides you with an easy to use widget which outputs weather information. When creating the widget just enter in your U.S.

sk33t

<h4>Requirements</h4>
<ul>
<li>WordPress 2.2 or 2.0.x/2.1.x with WordPress Widgets</li>
<li>PHP 4.3.0 or greater (needed for function file_get_contents)</li>
</ul>
<h4>Location</h4>
<p>The location can either be a zip code for US users or the locid. To find the locid, you can do a search using http://xoap.weather.com/search/search?where=[search parameters].This will return an XML file with search results and their corresponding locid’s.</p>
<p>You can also find it using the Weather.com website. After searching for and selecting your city, you will be sent to a url that will look something like, http://www.weather.com/outlook/driving/interstate/local/USTX0617?from=search_city, where USTX0617 is the locid.</p>
<h4>Image Hosting</h4>
<p>I’ve provided the images used and provided by weather.com <a href="http://nothingoutoftheordinary.com/weatherimages.tar.gz" rel="nofollow ugc">here</a>. If you want to host your own images, extract and upload the files, then, in the admin panel, edit the ‘Image Location’ field to point to your directory of images. Make sure to have the trailing slash.</p>
<p>If you don’t use your own images, you are free to use the ones that I’ve hosted, which are located at http://nothingoutoftheordinary.com/weatherimages/</p>
<h3>Formatting</h3>
<p>You can edit ‘Widget Formatting’ to change how the info is displayed. To access the variables, use this formatting:</p>
<ul>
<li>%loc% – Location</li>
<li>%temp% – Current temperature</li>
<li>%feels% – Feels like temperature</li>
<li>%icon% – The icon referring to the current weather. This is just a number</li>
<li>%iconhref% – The location of the image with your set image location at the front</li>
<li>%attribution% – The link supposedly required to be displayed. Weather data provided by weather.com®</li>
</ul>
<p>The default formatting is:</p>
<p><img src=”%iconhref%” alt=”%cond%” style=”float:right;” /><br />
%loc%<br /><br />
<span style=”font-size: 150%;”>%temp% °F</span><br />
(%feels% °F)<br /><br />
<span style=”font-size: 65%; float: right;”>%attribution%</a></p>


Weather Widget

This widget displays the current condition, temperature, and the feels like temperature. It uses weather.com’s xoap api to retrieve the information.

Easy Weather Widget vs Weather Widget