Smjrifle Interactive Maps with Google Maps and Leaflet

Smjrifle Interactive Maps with Google Maps and Leaflet brings powerful, customizable mapping functionality to WordPress with:

• Dual Engine Support: Google Maps or Leaflet (OpenStreetMap) fallback

• Marker Clustering: Group nearby markers at lower zoom levels

• Custom Markers: Use your own marker icons per location

• Snazzy Maps: 8+ preset map styles + custom JSON support

• Location Search: Built-in Autocomplete and Geocoding

• Location Cards: Display list of locations with grid layout

• Popups: Rich HTML popups with images, descriptions, and links

• Lazy Loading: Intersection Observer for performance

• Shortcode: [smjrgoma_map id=”123″] for easy embeds

• Per-Map Settings: Zoom, type, center, height, colors individually

Getting Started

• Create a Map Post: Go to WordPress admin > Smjrifle Interactive Maps with Google Maps and Leaflet > Add New Map

• Search & Add Locations: Use the search bar or click the map to place pins

• Configure: Set zoom, map type, height, colors in the Settings tab

• Style: Apply Snazzy Maps presets or custom JSON in the Style tab

• Publish: Save the map and get your shortcode

• Embed: Use [smjrgoma_map id=”123″] on any page/post

Admin Features

• Map Editor: Visual map for editing pins with drag-and-drop

• Location Manager: Edit title, image, description, and settings per marker

• Auto Geocoding: Click map to auto-fill address via Geocoding API

• Location Search: Autocomplete search to add locations instantly

• Snazzy Styles: Preset styles + custom JSON support

• Global Settings: Default marker icon, clustering, scroll behavior, lazy loading

Frontend Features

• Responsive Maps: Mobile-friendly with touch support

• Location Cards: Grid display of all locations with images

• Interactive: Click card to pan/zoom map and open popup

• Lazy Loading: Maps load only when visible (default on)

• Clustering: Markers group into clusters until you zoom in

• Popup Rich Content: Images, descriptions, links in marker popups

• Fallback Engine: Auto-switches to Leaflet if Google API unavailable

API Requirements

To use Google Maps, you need a Google API key with these APIs enabled:

• Google Maps JavaScript API

• Places API (for location search)

• Geocoding API (for address lookup)

Leaflet fallback requires no API key and uses OpenStreetMap tiles.

External Services

This plugin uses external services to provide map functionality.

Google Maps JavaScript API

• Used when a Google Maps API key is provided

• Loads scripts and map data from: https://maps.googleapis.com/

• Used for rendering maps, markers, clustering, autocomplete search, and geocoding

• Data sent: User-entered location queries (for search/geocoding)

• Privacy Policy: https://policies.google.com/privacy

OpenStreetMap (Leaflet fallback)

• Used when no Google Maps API key is provided

• Map tiles are loaded from OpenStreetMap servers

• Used for rendering maps and markers

• Data sent: Map tile requests based on user viewport

• Privacy Policy: https://wiki.osmfoundation.org/wiki/Privacy_Policy

Security

• Nonce Verification: All AJAX requests validated

• Capability Checks: Only authorized users can manage maps

• Input Sanitization: All user input sanitized per WordPress standards

• Output Escaping: All output properly escaped ( esc_html, esc_attr, esc_url, wp_kses_post )

• Database Safety: Uses WordPress APIs for data storage

Settings

• Map Engine: Auto (Google if API key, else Leaflet), Google, or Leaflet

• Marker Icon: Global default marker PNG/SVG URL

• Clustering: Toggle marker clustering globally

• Cluster Style: Default, Modern, or Minimal (Google Maps)

• Scroll Zoom: Enable/disable scroll wheel zoom

• Lazy Loading: Load maps only when visible

Shortcode

[smjrgoma_map id="123" height="500" zoom="14" class="custom-class"]

• id (required): Post ID of the map

• height (optional): Map height in pixels (default: post setting)

• zoom (optional): Default zoom level (default: post setting)

• class (optional): CSS class for wrapper div