Below, you’ll find a detailed guide on how to add the Simple Map 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 Simple Map Plugin shortcode not to show or not to work correctly.
Before starting, here is an overview of the Simple Map Plugin and the shortcodes it provides:
"Simple Map is a straightforward, user-friendly WordPress plugin. It allows you to effortlessly embed Google Maps into your pages or posts, providing clear, interactive location information."
- [simplemap]
Simple Map [simplemap] Shortcode
The Simple Map plugin shortcode integrates Google Maps into your WordPress site. It customizes map properties like width, height, zoom level, and map type. It also allows adding a specific location using latitude and longitude, or an address. It can include an info window and control the map type display. The shortcode also supports responsive design, adjusting the map’s size based on the device’s width.
Shortcode: [simplemap]
Parameters
Here is a list of all possible simplemap shortcode parameters and attributes:
width– Defines the width of the map in pixels or percentage.height– Defines the height of the map in pixels or percentage.zoom– Sets the initial zoom level of the map.breakpoint– Value to control responsive behavior of the map.map_type_control– Controls visibility of the map type control interface.map_type_id– Specifies the initial map type. ‘ROADMAP’ is the default type.infowindow– Controls the visibility of the information window on the map.url– Allows embedding a map using a URL.lat– Specifies the latitude for the map’s center point.lng– Specifies the longitude for the map’s center point.addr– Specifies the address to be used as the map’s center point.
Examples and Usage
Basic Example – A simple usage of the shortcode to display a map with default parameters.
[simplemap /]Advanced Examples
Displaying a map with a specified width, height, and zoom level. The width and height are set in pixels, and the zoom level is set at 10.
[simplemap width="500px" height="300px" zoom="10" /]Displaying a map with a specific latitude and longitude. The map will center on the coordinates provided.
[simplemap lat="40.7128" lng="-74.0060" /]Using the shortcode to display a map with a specific address. The map will center on the address provided.
[simplemap addr="1600 Amphitheatre Parkway, Mountain View, CA" /]Displaying a map with custom controls. The map_type_control parameter is set to true to display the map type control, and the map_type_id is set to ‘SATELLITE’ to display the map in satellite view.
[simplemap map_type_control="true" map_type_id="SATELLITE" /]Using the shortcode to embed a map from a specific URL. The URL is passed as a parameter to the shortcode.
[simplemap url="https://maps.google.com/?q=1600+Amphitheatre+Parkway,+Mountain+View,+CA" /]PHP Function Code
In case you have difficulties debugging what causing issues with [simplemap] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode( $this->get_shortcode_tag(), array( $this, 'shortcode' ) );Shortcode PHP function:
function shortcode( $p, $content = null ) {
add_action( 'wp_footer', array( &$this, 'wp_enqueue_scripts' ) );
if ( isset( $p['width'] ) && preg_match( '/^[0-9]+(%|px)$/', $p['width'] ) ) {
$w = $p['width'];
} else {
$w = apply_filters( 'simplemap_default_width', $this->width );
}
if ( isset( $p['height'] ) && preg_match( '/^[0-9]+(%|px)$/', $p['height'] ) ) {
$h = $p['height'];
} else {
$h = apply_filters( 'simplemap_default_height', $this->height );
}
if ( isset( $p['zoom'] ) && intval( $p['zoom'] ) ) {
$zoom = $p['zoom'];
} else {
$zoom = apply_filters( 'simplemap_default_zoom', $this->zoom );
}
if ( isset( $p['breakpoint'] ) && intval( $p['breakpoint'] ) ) {
if ( intval( $p['breakpoint'] ) > $this->max_breakpoint ) {
$breakpoint = $this->max_breakpoint;
} else {
$breakpoint = intval( $p['breakpoint'] );
}
} else {
$breakpoint = apply_filters(
'simplemap_default_breakpoint',
$this->breakpoint
);
}
if ( ! empty( $p['map_type_control'] ) ) {
$map_type_control = 'true';
} else {
$map_type_control = 'false';
}
if ( ! empty( $p['map_type_id'] ) ) {
$map_type_id = $p['map_type_id'];
} else {
$map_type_id = 'ROADMAP';
}
if ( $content ) {
$content = do_shortcode( $content );
}
if ( isset( $p['infowindow'] ) && $p['infowindow'] ) {
$infowindow = $p['infowindow'];
} else {
$infowindow = apply_filters( 'simplemap_default_infowindow', 'close' );
}
$addr = '';
$lat = '';
$lng = '';
if ( isset( $p['url'] ) && $p['url'] ) {
$iframe = '<iframe width="%s" height="%s" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="%s"></iframe>';
return sprintf(
$iframe,
$w,
$h,
esc_url( $p['url'].'&output=embed' )
);
} elseif ( isset( $p['lat'] ) && preg_match( '/^\-?[0-9\.]+$/', $p['lat'] )
&& isset( $p['lng'] ) && preg_match( '/^\-?[0-9\.]+$/', $p['lng'] ) ) {
$lat = $p['lat'];
$lng = $p['lng'];
} elseif ( isset( $p['addr'] ) && $p['addr'] ) {
if ( $content ) {
$addr = $p['addr'];
} else {
$content = $p['addr'];
}
} elseif ( ! $content ) {
return "";
}
return sprintf(
'<div class="%1$s"><div class="%1$s-content" data-breakpoint="%2$s" data-lat="%3$s" data-lng="%4$s" data-zoom="%5$s" data-addr="%6$s" data-infowindow="%7$s" data-map-type-control="%8$s" data-map-type-id="%9$s" style="width:%10$s;height:%11$s;">%12$s</div></div>',
esc_attr( apply_filters( 'simplemap_class_name', $this->class_name ) ),
esc_attr( $breakpoint ),
esc_attr( $lat ),
esc_attr( $lng ),
esc_attr( $zoom ),
esc_attr( $addr ),
esc_attr( $infowindow ),
esc_attr( $map_type_control ),
esc_attr( $map_type_id ),
esc_attr( $w ),
esc_attr( $h ),
esc_html( trim( $content ) )
);
}
Code file location:
simple-map/simple-map/simple-map.phpConclusion
Now that you’ve learned how to embed the Simple Map Plugin 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