Display HTML Marker for Google Maps

Using HTML Marker for Google Maps add-on you can easily add custom markers to your Google Maps. Style them with your own text, images, and designs to match your brand or map’s theme. The HTML Marker feature lets you design fully customized map markers. You have complete control over how your markers appear.

Please make sure you have installed the WP MAPS PRO plugin on your website. In case you have not installed it yet. Please download these plugins and configure them first. Here are the following steps to install the WP MAPS PRO plugin.

Process to configure HTML Markers on maps plugin:

1. Step 1: If you want to define the HTML marker on the category page. Please navigate to WP Maps Pro->Manage Categories, Now Add or Edit any Category, here you can see a section at last HTML Marker for Google Maps (Addon Settings), open this section.
   • In the same section, first, you have to Enable HTML Marker.
   • The second option is Enter HTML for Marker, you can add your marker HTML here using a placeholder by {marker_title}, {marker_category}, or {extra_field}. You can see all placeholders in the Show Placeholders button.
   
2. Step 2: To define the color in the HTML marker, please enable the Enable Color Picker option. With the help of a color picker, you can assign the HTML Marker Background Color and Text Color.
   
3. Step 3: If you want to define the HTML Marker on the Map Page. please navigate to the WP Maps Pro->Manage Map. Now Add or Edit any map, here you can see a section at the last HTML Marker for Google Maps (Addon Settings), You can see the same options as the category page is available there. You can define your HTML marker also from here.

You can see the HTML marker on the map.

To view a demo please click here.