As web development and search continues to expand and include more rich media, implementing Schema.org markup on your website is becoming more important everyday. Implementing Schema.org code allows search engines (Google, Bing, and Yahoo) the ability to identify and use the content on your website to expand your search results with rich snippets.
One of the most important factors in search, especially if you are a local business, is to show up properly in Google Maps and have the correct location listed. The best way to do that using Schema is to properly markup your Google Map URL and other business information.
Currently, there are two (2) different ways to implement Map Schema on your website.
Example 1: Using URL Schema
Simply add the URL to your map using the hasMap property.
Microdata Example Code Snippet
<div itemscope itemtype="http://schema.org/LocalBusiness">
<span itemprop="name">Example Company Name</span>
<!-- Place the Map code in the Places (LocalBusiness) section, not PostalAddress -->
<a itemprop="hasMap" href="https://maps.google.com/maps?cid=YOURCIDNUMBER" target="_blank">View Map</a>
</div>
JSON-LD Example Code Snippet
<script type='application/ld+json'>{
"@context": "http://www.schema.org",
"@type": "LocalBusiness",
"name": "Example Company Name",
"hasMap": "https://maps.google.com/maps?cid=YOURCIDNUMBER"
}
}</script>
Previous Version Note: The previous Schema.org format for map URLs was using itemprop=”maps” and a lot of people today still use this old format (or haven’t updated it since they first did it). According to Schema.org, hasMap supercedes maps.
Developer Note: Here’s a free tool that let’s you find your Google Maps CID number.
Example 2: Using Expanded Map Schema
In 2014, Google announced changes to the map protocols on Schema.org. They added the new “hasMap” property which now supersedes the previous “map” property. They also added the “mapType” property which allows you to specify the type of map you are linking to. More on the mapType property below.
Microdata Example Code Snippet
<div itemscope itemtype="http://schema.org/LocalBusiness">
<span itemprop="name">Example Company Name</span>
<!-- Place the Map code in the Places (LocalBusiness) section, not PostalAddress -->
<span itemscope itemprop="hasMap" itemtype="http://schema.org/Map">
<link itemprop="mapType" href="http://schema.org/VenueMap" />
<a itemprop="url" href="http://yourvenuemapsurl.com" target="_blank">View Map</a>
</span>
</div>
JSON-LD Example Code Snippet
<script type='application/ld+json'>{
"@context": "http://www.schema.org",
"@type": "LocalBusiness",
"name": "Example Company Name",
"hasMap": {
"@type": "Map",
"mapType": "VenueMap",
"url": "http://yourvenuemapsurl.com"
}
}
}</script>
hasMap Schema: MapCategoryType
Currently, there are four different types of category types available to markup your map URL with mapType Schema. The choices are ParkingMap (for a parking map), SeatingMap (for a seating map), TransitMap (for a transit map), and VenueMap (for a venue map: malls, auditoriums, museums, etc.). For more information and possible additions to this Schema markup, visit the official Schema hasMap and MapCategoryType pages.
I have researched a lot about how to add hasMap on my website and I have found your post describes it the best, thank you.