Below, you’ll find a detailed guide on how to add the Ventus Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Ventus – Weather Map Widget & Shortcode Plugin shortcode not to show or not to work correctly.
Before starting, here is an overview of the Ventus – Weather Map Widget & Shortcode Plugin and the shortcodes it provides:
"Ventus – Weather Map Widget & Shortcode is a convenient WordPress plugin. It enables users to easily integrate real-time weather maps and forecasts into their sites using widgets or shortcodes."
- [weather-map]
Ventus [weather-map] Shortcode
The Weather Map shortcode is a powerful tool that generates an interactive weather map. It utilizes various attributes like latitude, longitude, zoom level, and weather layer to create a personalized weather forecast.
Shortcode: [weather-map]
Parameters
Here is a list of all possible weather-map shortcode parameters and attributes:
width
– Defines the width of the weather mapheight
– Defines the height of the weather mapradius
– Sets the border radius of the maplat
– Sets the latitude coordinates of the maplon
– Sets the longitude coordinates of the mapzoom
– Determines the zoom level of the maplayer
– Selects the weather layer to displaylevel
– Determines the altitude level for the weather datascale
– Sets the temperature scale, Celsius or Fahrenheitunits
– Defines the wind measurement unitsmarker
– Determines if a location marker is displayedpressure
– Defines if pressure isolines are shownforecast
– Determines if a detailed forecast is displayedtime
– Sets the forecast time, current or futureloading
– Sets the lazy-loading property of the mapmodel
– Selects the weather forecast model
Examples and Usage
Basic example – Display a weather map with default settings
[weather-map /]
Advanced examples – Customizing the weather map display using shortcode attributes
Display a weather map with specific latitude and longitude, showing the wind layer at surface level.
[weather-map lat="40.7128" lon="-74.0060" layer="wind" level="surface" /]
Display a weather map with a specific width and height, zoomed into a specific level, and showing the temperature in Celsius instead of the default Fahrenheit.
[weather-map width="50%" height="500px" zoom="10" scale="C" /]
Display a weather map with a marker at a specific latitude and longitude, showing the pressure isolines, and using the ECMWF weather forecast model.
[weather-map marker="true" lat="40.7128" lon="-74.0060" pressure="true" model="ecmwf" /]
Display a weather map with a specific forecast time and detail latitude and longitude, showing the wind measurement units in knots.
[weather-map time="2021-09-01 12:00" detailLat="40.7128" detailLon="-74.0060" units="knots" /]
PHP Function Code
In case you have difficulties debugging what causing issues with [weather-map]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode( 'weather-map', array( $this, 'create_the_shortcode' ) ); // maintained for backward-compatibility
Shortcode PHP function:
function create_the_shortcode( $attributes ) {
// Initialize the output.
$output = '';
// Initialize the attributes and their default values.
$atts = shortcode_atts(
array(
'width' => '100%',
'height' => '350px',
'radius' => '0',
'lat' => '53.199',
'lon' => '-7.603',
'zoom' => '5',
'layer' => 'wind',
'level' => 'surface',
'scale' => 'C',
'units' => 'default',
'marker' => '',
'pressure' => '',
'forecast' => '',
'time' => 'now',
'loading' => 'lazy',
'model' => 'ecmwf'
),
$attributes
);
// Start the iframe.
$output .= '<iframe ';
// Create a unique title attribute.
$output .= 'title="Ventus Weather Map Shortcode ' . esc_attr( $atts['lat'] ) . ' ' . esc_attr( $atts['lon'] ) . '" ';
// The lazy-loading property.
$output .= 'loading="' . esc_attr( $atts['loading'] ) . '" ';
// Set the iframe width and height.
$output .= 'style="width: ' . esc_attr( $atts['width'] ) . '; height: ' . esc_attr( $atts['height'] ) . '; ';
// Set the border radius and box-sizing.
$output .= 'border-radius: ' . esc_attr( $atts['radius'] ) . '; box-sizing: border-box;" ';
// The iframe source URL.
$output .= 'src="https://embed.windy.com/embed2.html?';
// Latitude and longitude.
$output .= 'lat=' . esc_attr( $atts['lat'] ) . '&lon=' . esc_attr( $atts['lon'] );
// Zoom level.
$output .= '&zoom=' . esc_attr( $atts['zoom'] );
// The weather layer (overlay).
$output .= '&overlay=' . esc_attr( $atts['layer'] );
// Show or hide the marker.
$output .= '&marker=' . esc_attr( $atts['marker'] );
// Show or hide pressure isolines.
$output .= '&pressure=' . esc_attr( $atts['pressure'] );
// Detail latitude and longitude.
$output .= '&detailLat=' . esc_attr( $atts['lat'] ) . '&detailLon=' . esc_attr( $atts['lon'] );
// The wind measurement units.
$output .= '&metricWind=' . esc_attr( $atts['units'] );
// The temperature scale.
$output .= '&metricTemp=°' . esc_attr( strtoupper( $atts['scale'] ) );
// The spot forecast.
$output .= '&detail=' . esc_attr( $atts['forecast'] );
// The forecast time.
$output .= '&calendar=' . esc_attr( $atts['time'] );
// The weather forecast model.
$output .= '&product=' . esc_attr( $atts['model'] );
// The level (altitude).
$output .= '&level=' . esc_attr( $atts['level'] );
// Complete the iframe.
$output .= '&menu=&message=true&type=map&location=coordinates&radarRange=-1" frameborder="0"></iframe>';
// Return the complete output.
return $output;
}
Code file location:
weather-map-widget/weather-map-widget/classes/class-ventus-shortcode.php
Conclusion
Now that you’ve learned how to embed the Ventus shortcode, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.
Leave a Reply