jhotadhari

<ul>
<li>## Deprecated</li>
<li>This project is no longer active and not recommended for use.</li>
<li>It works with WordPress version < 5.0 and the gutenberg plugin. But it doesn’t work with any current version!</li>
<li>It is left here for reference</li>
</ul>
<p>Highly customizable Map Block for Gutenberg, based on Leaflet</p>
<ul>
<li>Customize the Map and its Features directly from within the <strong>Gutenberg Block</strong></li>
<li><strong>Draw and edit Features</strong>. Markers, Lines, Polygons …</li>
<li><strong>Customize Feature-Appearance</strong>. Icon/Shadow, Color, Opacity, Class-Names …</li>
<li>A <strong>Wysiwyg Editor</strong> to Edit the Popup-Content. Use <strong>Images/Videos/Audios</strong> inside the Popup-Content</li>
<li><strong>Customize the Map</strong> itself. Dimensions, Baselayers, Controls …</li>
<li>Map Features are shareable and can be used between users and posts (depending on Features settings)</li>
</ul>
<blockquote>
<p>Geo Masala on <a href="https://github.com/jhotadhari/geo-masala" rel="nofollow ugc">GitHub</a>.<br />It’s open-source, free as freedom, free of cost and it will remain free.</p>
</blockquote>
<h4>How to use</h4>
<p>Edit any Post with gutenberg and add a ‘Geo Masala Map’ block, save post and done. Your post will display a map.</p>
<ul>
<li>Draw some Features or select some from the Feature-Panel.
<ul>
<li>The default Status for a new Feature is draft, only published ones are displayed in frontend.</li>
<li>To get Features from other posts/users, open Feature-Panel and adjust the Filters.</li>
</ul>
</li>
<li>Edit the Feature, change status, icon or color, change the popup content and title.</li>
<li>Open the Map Settings Panel and customize the controls.</li>
<li>Change the Feature sharing settings for a single Feature, and reuse the Feature in other Posts</li>
<li>…</li>
</ul>
<blockquote>
<p>The <a href="https://wordpress.org/plugins/gutenberg/" rel="ugc">Gutenberg Editor Plugin</a> <strong>is required</strong> for WordPress versions prior to 5.0, see <a href="https://wordpress.org/plugins/geo-masala/#installation" rel="ugc">requirements</a></p>
</blockquote>
<h4>What is a Feature?</h4>
<p>The term “Feature” is used in the cartographic context. A representation of a real-world object on a map (<a href="https://support.esri.com/en/other-resources/gis-dictionary/term/dcc335be-78ae-4bd2-b254-b44c37343f75" rel="nofollow ugc">feature|Definition – Esri Support GIS Dictionary</a>).<br />
Within this plugin, a Feature can represent a simple location (Marker), a way/route/track (Polyline) or an Area (Polygon/Rectangle).<br />
A couple of properties are stored with the Feature, eg. appereance and popup-content data.</p>
<h4>How does the Plugin work?</h4>
<p>A Feature is saved as a post type, and not saved to the Block!</p>
<ul>
<li>The Plugin registered a new custom-post-type ‘geom_feature’. Each geom_feature is used to store a single cartographic Feature, formatted in geoJSON. The cartographic Feature and other data (appearance, popup-content …) are stored as post-meta.</li>
<li>The geom_feature is registered without wordpress ui (List table and editing screen) or appearance in admin-navigation or admin-bar.</li>
<li>When editing any post with gutenberg, the ‘Geo Masala Map’ block displays a leaflet map and some settings-panels beneath it. All crud actions (create, read, update, delete) for geom_feature(s) are handled within the editor block using the wp rest api and its backbone client. All geom_feature crud actions are saved immediately (Some ui elements have reset/save buttons).</li>
<li>default post_status for geom_feature(s) is ‘draft’.</li>
<li>The Features-Panel lists geom_features. Features on Map are highlighted. If a Feature gets removed from map, the geom_feature is still saved and available to use.</li>
<li>Therefor a Feature created by one post can be used in another post as well (depending on the individual feature settings). All changes made to a geom_feature are saved immediately and will effect all posts where the Feature is displayed.</li>
<li>All attributes related to the map (and not to its features) are stored as block attributes.</li>
</ul>
<h4>In Development</h4>
<p>The Plugin is in early development (and needs a sponsor to go on).<br />
Some ui will change and more options will be added.</p>
<p>Coming soon hopefully:</p>
<ul>
<li>wiki and tutorials</li>
<li>Possibility to draw routes on a map.</li>
<li>Import for gpx/geoJSON/kml</li>
<li>Method to add altitude and slope values for features</li>
<li>Elevation profile for line/routes</li>
<li>Color line/routes by z value or slope</li>
<li>…</li>
</ul>
<p>Known issues:</p>
<ul>
<li>Currently there is a maximum for hundred Features, will be changed in future.</li>
<li>Feature Sharing: The popover control controls if the Feature appears in a Feature-Pool. If it is already in use somwhere, it will still be used, but just not displayed in Feature-Panel.</li>
</ul>
<h4>Contribute</h4>
<ul>
<li>Most welcome 🙂</li>
<li>Geo-Masala is free and open source. The source is hosted on <a href="https://github.com/jhotadhari/geo-masala" rel="nofollow ugc">GitHub</a>. So dig the code as you like.</li>
<li>For <strong>support</strong>, to <strong>request new plugin-features</strong> or inform me about <strong>issues and bugs</strong> <a href="https://github.com/jhotadhari/geo-masala/issues/new" rel="nofollow ugc">create a new issue on Github</a> or <a href="https://wordpress.org/support/plugin/geo-masala" rel="ugc">add a new topic to WP’s support forum</a></li>
<li>Love to get your <strong>feedback</strong>, <a href="https://wordpress.org/support/plugin/geo-masala/reviews/#new-post" rel="ugc">Create a new review and rate this Plugin</a>, write a tutorial and tell your friends.</li>
<li><a href="https://waterproof-webdesign.info/en/#contact" rel="nofollow ugc">Tell me</a> your wishes, maybe get me a bowl of rice and some masala: <a href="http://waterproof-webdesign.info/donate" rel="nofollow ugc">Donate</a></li>
</ul>
<blockquote>
<p>I’m hungry, cycling around the world and Geo-Masala is coded while sitting wet in a tent during Monsoon somwhere in south himalaya. I appreaciate any kind of <a href="http://waterproof-webdesign.info/donate" rel="nofollow ugc">donation</a> or sponsorship.</p>
</blockquote>
<h4>Thanks for beautiful ressoucres</h4>
<ul>
<li>WordPress, the <a href="https://developer.wordpress.org/rest-api/" rel="nofollow ugc">WP REST API</a>, the <a href="https://developer.wordpress.org/rest-api/using-the-rest-api/backbone-javascript-client/" rel="nofollow ugc">Backbone JavaScript Client</a> and the <a href="https://wordpress.org/gutenberg/handbook/" rel="ugc">Gutenberg Editor</a> and its components.</li>
<li><a href="http://backbonejs.org/" rel="nofollow ugc">Backbone</a>, <a href="http://marionettejs.com/" rel="nofollow ugc">Backbone Marionette</a>, <a href="https://www.npmjs.com/package/backbone.deep-model" rel="nofollow ugc">Backbone Deep Model</a> and <a href="https://github.com/onsi/cocktail" rel="nofollow ugc">Backbone Cocktail</a>.</li>
<li><a href="https://reactjs.org/" rel="nofollow ugc">React</a>, <a href="https://github.com/bvaughn/react-virtualized" rel="nofollow ugc">react-virtualized</a> and <a href="https://github.com/khan/react-multi-select" rel="nofollow ugc">react-multi-select</a></li>
<li><a href="http://leafletjs.com/" rel="nofollow ugc">Leaflet</a> and Plugins:
<ul>
<li><a href="https://github.com/Leaflet/Leaflet.draw" rel="nofollow ugc">Leaflet Draw</a></li>
<li><a href="https://github.com/justinmanley/leaflet-draw-toolbar" rel="nofollow ugc">Leaflet Draw Toolbar</a></li>
<li><a href="https://github.com/smeijer/leaflet-geosearch" rel="nofollow ugc">Leaflet Geosearch</a></li>
<li><a href="https://github.com/ebrelsford/Leaflet.loading" rel="nofollow ugc">Leaflet Loading</a></li>
<li><a href="https://github.com/leaflet-extras/leaflet-providers" rel="nofollow ugc">Leaflet Providers</a></li>
<li><a href="https://github.com/brunob/leaflet.fullscreen" rel="nofollow ugc">Leaflet Fullscreen</a></li>
<li><a href="https://github.com/Leaflet/Leaflet.toolbar" rel="nofollow ugc">Leaflet Toolbar</a></li>
</ul>
</li>
<li>This Plugin is generated with <a href="https://github.com/jhotadhari/generator-pluginboilerplate" rel="nofollow ugc">generator-pluginboilerplate version 1.2.3</a></li>
<li>Background for plugin banner and icon <a href="http://opentopomap.org/" rel="nofollow ugc">OpenTopoMap</a></li>
<li>…</li>
</ul>


Geo Masala

Highly customizable Map Block for Gutenberg, based on Leaflet

WePlugins - WordPress Development Company

<p><strong>WP Maps</strong> is a powerful and user-friendly WordPress map plugin that supports both Google Maps and OpenStreetMap. With just a few clicks, you can create unlimited maps with custom markers, filterable listings, store locators, and dynamic infowindows. Perfect for real estate listings, directories, multi-location businesses, and more.</p>
<ul>
<li>Unlimited maps and locations</li>
<li>Store locator with search and filters</li>
<li>Custom markers, SVG support, and clustering</li>
<li>Info windows on click or hover</li>
<li>KML, KMZ, GeoJSON, and layer integration</li>
<li>OpenStreetMap Maps require no API key; Google Maps support available</li>
</ul>
<h3>Try It Now</h3>
<p>Explore the plugin instantly using the WordPress Playground:<br />
👉 <a href="https://playground.wordpress.net/?plugin=wp-google-map-plugin" rel="nofollow ugc">Try WP Maps</a></p>
<h3>Features</h3>
<h3>🗺️ Map Creation & Display</h3>
<ul>
<li>Create unlimited maps with shortcode support</li>
<li>Display maps in posts, pages, widgets</li>
<li>Auto-center by visitor location or assigned locations</li>
<li>Show/hide markers on load</li>
</ul>
<h3>📌 Marker & Infowindow Controls</h3>
<ul>
<li>Use custom or pre-built marker icons (SVG supported)</li>
<li>Infowindows on click or hover</li>
<li>Bounce/drop animation effects</li>
<li>Center or zoom on marker click</li>
</ul>
<h3>📋 Listings & Filters</h3>
<ul>
<li>Show listing below map with search and filters</li>
<li>Enable category, sort, per-page, and filters</li>
<li>Customize listing layout</li>
<li>Show info window when listing title is clicked</li>
</ul>
<h3>🎨 Design & Themes</h3>
<ul>
<li>Custom map color schema</li>
<li>Set primary/secondary color</li>
<li>Add custom CSS</li>
<li>Responsive & mobile-friendly design</li>
</ul>
<h3>⚙️ Controls & Settings</h3>
<ul>
<li>Enable/disable zoom, fullscreen, map type, scale, street view</li>
<li>Enable search box and “locate me” controls</li>
<li>Limit panning using SW/NE coordinates</li>
</ul>
<h3>🌐 Map Layers & Data</h3>
<ul>
<li>KML/KMZ, Traffic, Transit, Bicycling layers</li>
<li>GeoJSON support</li>
<li>Import/export settings via JSON</li>
</ul>
<h3>💻 Compatibility</h3>
<p>Works with all major page builders and themes:<br />
* Elementor, WPBakery, Divi, Gutenberg, Brizy, Beaver Builder<br />
* Astra, Avada, OceanWP, GeneratePress, Hello Elementor</p>
<p>Here is a quick highlight on the numerous customizable features offered by the free and pro versions of the <strong><a href="https://www.wpmapspro.com?utm_source=wordpress&utm_medium=liteversion&utm_campaign=freemium&utm_id=freemium" rel="nofollow ugc">WP MAPS PRO Version</a></strong>.</p>
<ul>
<li>NO API Key required for OpenStreetMap Maps and API Keys is required for Google Maps.</li>
<li>Fully GDPR-compliant Google Maps integration for secure and privacy-friendly usage</li>
<li>Use Google Maps, OpenStreetMap or Mapbox as your map provider. Easy switching between each map provider.</li>
<li>Show a listing of locations below the map with built-in search and filter controls</li>
<li>Use SVG as marker icons – choose from pre-built SVGs or upload your own</li>
<li>Apply multiple Infowindow designs for custom popup layouts</li>
<li>Create unlimited Google/Leaflet Maps with custom marker icons, categories, and assigned locations</li>
<li>Add and manage multiple locations with rich content and info windows</li>
<li>Assign multiple locations to a single map for complex layouts</li>
<li>Show info windows on click or hover with customizable content</li>
<li>Display maps on any post, page, or widget using shortcode or sidebar widget</li>
<li>Define custom center latitude/longitude for each map</li>
<li>Auto-center map based on assigned locations</li>
<li>Categorize locations for filterable maps and better organization</li>
<li>Choose from over 100+ ready-to-use colorful markers via <a href="https://mapicons.mapsmarker.com/" rel="nofollow ugc">Map Icons Collection</a></li>
<li>Enable marker clustering to handle dense location areas</li>
<li>Choose from 4 map types: Roadmap, Satellite, Hybrid, and Terrain</li>
<li>Set custom map height, width, and zoom level easily</li>
<li>Enable or disable map drag, scroll zoom, and interactivity</li>
<li>Add layers like Traffic, Transit, Bicycling, and more for enhanced context</li>
<li>Support for Street View, 45° imagery, and POV controls</li>
<li>Add visual elements like circles to highlight areas</li>
<li>Fully responsive maps – looks perfect on desktop, tablet, and mobile</li>
<li>Cross-browser compatible – tested on IE8+, Chrome, Firefox, Safari</li>
<li>Multilingual ready – supports WPML and translation plugins</li>
<li>Works across WordPress Multisite, with network-wide activation support</li>
<li>Easily style maps using Snazzy Maps</li>
<li>Built-in search control to locate places directly on the frontend map</li>
<li>Filter markers on the frontend by category</li>
<li>Seamless upgrade to Pro – no data loss when switching from free to paid</li>
</ul>
<h3>🏬 Use Cases – Map Solutions for Every Business</h3>
<p>WP Maps helps you build advanced location maps for any industry. From store locators to real estate maps, here are popular use cases powered by Google Maps or Leaflet:</p>
<ul>
<li>🛍️ Retail Store Locator – Showcase nearby outlets, branches, or chain locations  </li>
<li>🍽️ Restaurant Locator – Help users find your cafes, diners, or food franchises  </li>
<li>🏠 Real Estate Property Map – Display properties with filters for listings  </li>
<li>🏥 Hospital & Clinic Map – Show medical centers, diagnostic labs & walk-ins  </li>
<li>🏋️ Gym & Fitness Center Locator – Promote local gyms, yoga studios & wellness hubs  </li>
<li>🛒 Shopping Mall Directory – Build interactive directories with category filters  </li>
<li>🏨 Hotel & Resort Locator – List resorts, BnBs, and vacation rentals by location  </li>
<li>🚗 Car Dealership Map – Map showrooms, service centers, and authorized dealers  </li>
<li>🏦 Bank & ATM Locator – Help customers locate ATMs and branches  </li>
<li>💊 Pharmacy Finder – Display medical stores and 24/7 pharmacy locations  </li>
<li>💅 Salon & Spa Locator – Show salons, nail bars, and beauty spas nearby  </li>
<li>✂️ Barber Shop Locator – Map grooming centers, barbershops, and hair stylists  </li>
<li>🎓 School & University Maps – Display educational institutions with filters  </li>
<li>🎤 Event Venue Locator – Help users find event halls, venues, and stadiums  </li>
<li>🎬 Cinema & Entertainment Map – List theaters, gaming zones, and arcades  </li>
<li>🖼️ Museum & Art Gallery Locator – Showcase local exhibitions and museums  </li>
<li>🏛️ Government Office Map – Map municipal offices, courts, or embassies  </li>
<li>📦 Post Office & Courier Center Locator – Find shipping centers and drop boxes  </li>
<li>⛪ Religious Center Locator – Show churches, mosques, temples, or community halls  </li>
<li>📚 Library Map – Display public and academic library locations  </li>
<li>🐾 Veterinary & Pet Store Map – Highlight vets, clinics, or pet supply stores  </li>
<li>🔧 Hardware & Home Services Map – Show electricians, repair centers, or hardware stores  </li>
<li>💼 Co-working Space Locator – Help users find shared office spaces or business hubs  </li>
<li>🏗️ Construction & Project Map – Showcase new projects or development plots  </li>
<li>🍷 Wine & Liquor Store Map – Find wine shops and liquor outlets with filters  </li>
<li>🚴 Outdoor & Sports Store Map – Locate gear shops, bike rental points, etc.  </li>
<li>🧸 Toy Store Locator – Promote branded or local toy stores  </li>
<li>🌻 Garden Center & Nursery Map – Help users find garden shops and nurseries  </li>
<li>📖 Bookstore Locator – Showcase independent and chain bookstores  </li>
<li>📱 Electronics Store Map – Map mobile, computer, and appliance retailers  </li>
<li>👗 Clothing Store Locator – Help users find fashion outlets and boutiques  </li>
<li>🛠️ Service Center Locator – Map repair centers for electronics, cars, or devices  </li>
<li>⚖️ Legal & Consultancy Locator – List law firms, advisors, and service offices  </li>
<li>📄 Insurance Office Map – Show agents, offices, and policy assistance centers  </li>
<li>🚛 Dealer & Warehouse Locator – Display regional warehouses and distributors  </li>
<li>🍼 Childcare & Preschool Finder – Help parents locate daycares and nurseries  </li>
<li>🛒 Supermarket & Grocery Store Map – Show supermarkets, mini-markets, or organic stores</li>
</ul>
<p><strong>💡 Whether you’re running a small local shop or a global brand, WP Maps helps you build responsive, searchable, and filterable maps tailored to your business.</strong></p>
<h3>How It Works</h3>
<ol>
<li>Add your locations from <strong>Add Location</strong></li>
<li>Create a map from <strong>Add Map</strong> and assign locations</li>
<li>Use the shortcode (from <strong>Manage Maps</strong>) in posts, pages, or widgets</li>
</ol>
<p><em>Note: Google Maps requires an API key. OpenStreetMap works without a key.</em></p>
<h3>Important Links</h3>
<ul>
<li><a href="https://www.wpmapspro.com/try-now/" rel="nofollow ugc">Live Demos</a></li>
<li><a href="https://www.wpmapspro.com/tutorials/" rel="nofollow ugc">Tutorials</a></li>
<li><a href="https://www.wpmapspro.com/map-hooks/" rel="nofollow ugc">Hooks & Filters</a></li>
<li><a href="https://weplugins.com/support/" rel="nofollow ugc">Support</a></li>
</ul>


WP Maps – Store Locator,Google Maps,OpenStreetMap,Mapbox,Listing,Directory & Filters

WordPress map plugin for Google Maps, OpenStreetMap & Mapbox with store locator, filterable listings & custom markers.

Geo Masala vs WP Maps – Store Locator,Google Maps,OpenStreetMap,Mapbox,Listing,Directory & Filters