The Awesome Weather Widget can also be used anywhere through the shortcode or even using a PHP function in a theme.
The shortcode is [awesome-weather].
If you wanted to do the same thing with PHP you can use the function:
awesome_weather_shortcode( $atts_array ).
Both require a set of attributes (simplified to $atts in my plugin) that change its behavior. Here are the options:
| Attribute | Default Value | For Plugin |
|---|---|---|
| owm_city_id | 0 | BOTH |
| size | wide | BOTH |
| units | F | BOTH |
| override_title | Location Search Field | BOTH |
| forecast_days | 5 | BOTH |
| hide_stats | false | BOTH |
| show_link | false | BOTH |
| custom_bg_color | depending on weather | BOTH |
| background | false | BOTH |
| background_by_weather | false | BOTH |
| background_by_weather_ext | jpg | BOTH |
| text_color | #ffffff | BOTH |
| hide_attribution | false | BOTH |
| inline_style | empty | BOTH |
| locale | value of get_locale() | BOTH |
| custom_template_name | empty | PRO |
| show_icons | 0 | PRO |
| use_user_location | false | PRO |
| allow_user_to_change | false | PRO |
| ajax | 0 | PRO |
| loader | true | PRO |
| inline_style_wrap | empty | PRO |
| skip_geolocate | false | PRO |
owm_city_id
Default: 0
Plugin: Both
Each city has a City ID associated with it. The easiest way to get one is to load a temporary Awesome Weather widget onto your site and use the search box in the settings to find your city and then copy the ID it provides. You can then delete the widget. 
Once you have your city ID you can then add it to your shortcode like this. Please include the location attribute as well. This will be the title of your widget. More information about finding your City ID.
[awesome-weather owm_city_id="4699066" location="Houston, US"]
size
Default: wide
Plugin: Both
Used to change the template of the widget.
//FREE & PRO [awesome-weather size="wide"] [awesome-weather size="tall"] // PRO [awesome-weather size="micro"] [awesome-weather size="showcase"] [awesome-weather size="long"] [awesome-weather size="boxed"] [awesome-weather size="tall"] [awesome-weather size="material"] [awesome-weather size="basic"] [awesome-weather size="custom"] // USED FOR CUSTOM LAYOUTS
// FREE & PRO [awesome-weather units="C"] [awesome-weather units="F"] // PRO [awesome-weather units="auto"]
override_title
Default: Location Search Field
Plugin: Both
You can change the banner title field.
[awesome-weather override_title="Montreal, Canada"] [awesome-weather override_title="Whatever"]
forecast_days
Default: 5
Plugin: Both
You can change the number of forecast days available by including setting a number or set to ‘hide’ to not show the section.
[awesome-weather forecast_days="hide"] [awesome-weather forecast_days="3"]
hide_stats
Default: false
Plugin: Both
You can hide the stats (or description) section. This is the part that shows the current wind speed, humidity, etc.
[awesome-weather hide_stats="1"]
show_link
Default: false
Plugin: Both
You can show a link to the weather providers website that shows an extended forecast. You can customize the text and url with two other attributes: extended_url and extended_text.
[awesome-weather show_link="1"] [awesome-weather show_link="1" extended_url="https://openweathermap.org/city/4699066" extended_text="See More Weather"]
custom_bg_color
Default: depending on weather
Plugin: Both
You can change the look of your widget through CSS or through the background fields. Simply insert a hex, rgba or ‘transparent’ value in the attribute
[awesome-weather custom_bg_color="#ccc"] [awesome-weather custom_bg_color="#acacac"] [awesome-weather custom_bg_color="rgba(255,255,255,0.5)"] [awesome-weather custom_bg_color="rgba(0,0,0,0.1)"] [awesome-weather custom_bg_color="transparent"]
background
Default: false
Plugin: Both
For a custom background image simply insert the URL to your image.
[awesome-weather background="http://urltoimage.jpg"]
background_by_weather
Default: false
Plugin: Both
Theis attribute can have different background images based on the current weather. For more information on this, check out the help document.
[awesome-weather background_by_weather="1"]
background_by_weather_ext
Default: jpg
Plugin: Both
By default, my plugin looks for jpeg images to do the background by weather option. If you wanted to put custom items in your theme, you can change the extension of the files to look for here.
[awesome-weather background_by_weather_ext="gif"] [awesome-weather background_by_weather_ext="png"]
text_color
Default: #ffffff
Plugin: Both
You can easily change the text of the widget without CSS using this attribute If you would like to use CSS, you would add the following to your theme style.css: .awesome-weather-wrap, .awesome-weather-wrap strong { color: #000; }
[awesome-weather text_color="#000"] [awesome-weather text_color="rgba(0,0,0,0.5)"]
hide_attribution
Default: false
Plugin: Both
If you want to hide the ‘Weather by OpenWeatherMaps’ message at the bottom of the widget you would use this attribute.
[awesome-weather hide_attribution="1"]
inline_style
Default: empty
Plugin: Both
If you want to add some CSS to just one widget, you could use your style.css file or just put the styles into this attribute. This will be added to the main wrapper element of the widget.
[awesome-weather inline_style="width:300px;height:200px;color:#000;font-size:2em;"]
locale
Default: value of get_locale()
Plugin: Both
You can set the locale used to grab weather data. Each provider has a specific list of options. Here is the list for OpenWeatherMap.
// OPENWEATHERMAPS [awesome-weather locale="es"] [awesome-weather locale="ru"] [awesome-weather locale="zh_tw"]
custom_template_name
Default: empty
Plugin: Pro
When creating a custom template, you’ll need to set size="custom" and add this attribute. Set the value to match the name of the file in your theme like this: awe-your_name.php
// matching: awe-slim.php in your theme folder [awesome-weather size="custom" custom_template_name="slim"] // matching: awe-hero.php [awesome-weather size="custom" custom_template_name="hero"]
show_icons
Default: 0
Plugin: Pro
You can use weather icons associated with the weather. Note that each template shows and hides the icons differently. Some use them in the description some don’t and some don’t show them in the forecast. This is intentional.
[awesome-weather show_icons="1"]
use_user_location
Default: false
Plugin: Pro
You can ping the users IP address to get their current location and show weather based on that data.
[awesome-weather use_user_location="1"]
allow_user_to_change
Default: false
Plugin: Pro
This adds the pin icon in the corner which attempts to use HTML5 geolocation and then falls back to a search box.
[awesome-weather allow_user_to_change="1"]
You can opt to load your widget using AJAX. This will make your widget load on the page only after the rest of the stuff on the page has loaded. This results in faster page loads and happier clients. It is recommended to use an id attribute as well, to make sure the widget loads in the proper widget wrapper.
[awesome-weather ajax="1"]
loader
Default: true
Plugin: Pro
When using ajax, a loader appears before it loads. You can turn this off.
[awesome-weather loader="false"]