In this documentation article, we will guide you on how to use WP Map Block for Google Maps into your WordPress website using the WP Map Block plugin.
WP Map Block is a popular and fast-growing Gutenberg block plugin that allows you to seamlessly integrate Google Maps and OpenStreetMaps without the need for an API key. With its user-friendly interface, you can easily create a map for your business or any other purpose within the WordPress Gutenberg editor.
Academy LMS is a powerful WordPress plugin for creating eLearning platforms. Developed by the same company as WP Map Block, it offers a user-friendly interface and robust features to easily manage and sell online courses. Get a 40% discount on Academy LMS Pro with coupon code “WPMAPBLOCK” before it expires.
Installation and Activation:
To begin using WP Map Block, follow these steps:
- Open your WordPress dashboard.
- Navigate to the Plugins section and click on “Add New.”
- Search for the “WP Map Block” plugin in the WordPress repository.
- Install the free WP Map Block plugin.
- Activate the plugin.
Adding the Google Maps Gutenberg Block:
Once you have installed and activated WP Map Block, you can add the Google Maps Gutenberg block to your desired page or post. Here’s how:
- Open the page or post where you want to add the map.
- Click on the “+” plus button to insert a new block.
- Search for “Map Block” and select the “WP Map Block” from the available blocks.
Customizing Map Settings:
After adding the WP Map Block, you will see the map displayed in the Gutenberg editor. On the right-hand side, you can find the Map Settings. Here are the customization options available to you:
- Adjust the Width and Height of the map in pixels.
- Choose the map type between Google Maps and OpenStreetMap.
- Modify the Zoom Level of the map.
- Add your location by clicking on Map Marker or Edit, and provide the necessary details.
Setting Map Location and Marker:
To set your map location and marker, follow these steps:
- Search for your desired location in the provided search field.
- Set the map title and content.
- Make the current marker your default position, if desired.
- Choose an icon type for your marker.
- Once you have made all the changes, click Save and Close.
After modifying the settings, click on the Publish button to publish the map on your website, or click on the Preview button to view the map on your website.
Adding More Marker
If you need more custom markers, then you can add more markers by clicking on Add Makerker, furthermore, you can select every time Google Maps or OpenStreetMap for your marker. If you need to delete your added marker, just click on Following Place (Cross X).
Additional Features of WP Map Block:
WP Map Block offers several features that make it a top choice for map integration:
- Ease of use with a simple drag-and-drop interface.
- Support for unlimited map tilers and markers.
- Ability to edit each marker separately.
- Compatibility with various Leaflet tilers.
- Full-screen map control with zooming and arrow options.
- Multiple marker support for different areas and places.
In this documentation, we have outlined the steps on how to use WP Map Block Google Maps Gutenberg block to your WordPress website using the WP Map plugin. With its intuitive interface and extensive customization options, WP Map Block easily incorporates interactive maps into your WordPress content. Enjoy the benefits of visualizing locations, providing directions, and enhancing the user experience on your website.