Short tutorial on implementing the new Maps Ad Unit

May 22, 2009 14:24 GMT  ·  By

Google has announced a new feature for the popular mapping service Google Maps today in the form of an ad module. The Maps Ad Unit, as it is called, can be integrated into your existing Google Maps API implementation.

The Maps Ad Unit is an optional feature that geo developers and others who use Google Maps on their sites can use to generate revenue. The ads appear inside the area where the map is rendered in a position you can specify. The ads are aware of the map's current location and change according to the user's movements.

Let's see how you can implement this new feature. You must have an AdSense account, obviously, which you will have to link with the Maps Ad Unit, and AdSense for Content must be enabled for that account but the rest is pretty straightforward. First you need to create a GadsManager of style “adunit.” Then you will need to specify your AdSense for Content (AFC) publisher ID (you will have to have one) to the GadsManager constructor. If you have an AdSense for Content channel set up you can optionally specify that too.

Here is the code that creates a Maps Ad Unit with the publisher ID and AdSense for Content already known.

code
var publisher_id = "pub-1234123412341234"; // Replace 1234123412341234 with your Google AdSense publisher id.

adsManagerOptions = {
maxAdsOnMap : 2,
style: 'adunit',
channel: '12345678' // This field is optional - replace 12345678 with a channel number that you created for GooYAMLgle AdSense tracking
};

adsManager = new GAdsManager(map, publisher_id, adsManagerOptions);
adsManager.enable();
If you want a smaller ad unit you can set maxAdsOnMap to 1 in your adsManagerOptions. Also if you want the Map Ad Unit to be placed elsewhere on the map you can modify GadsManager's position by specifying an alternative GcontrolPosition like this:
code
var publisher_id = "pub-1234123412341234"; // Replace 1234123412341234 with your Google AdSense client id.

var adPos = new GControlPosition(G_ANCHOR_BOTTOM_RIGHT, new GSize(7, 20)); // Set the anchor position and GSize offset to your desired values.

adsManagerOptions = {
maxAdsOnMap : 2,
style: 'adunit',
channel: '12345678', // This field is optional - replace 12345678 with a channel number that you created for Google AdSense tracking
position: adPos
};

adsManager = new GAdsManager(map, publisher_id, adsManagerOptions);
adsManager.enable();
You can find more information on the Google geo developers blog and in the Google Maps API documentation.