Maps Documentation

Usage

Maps behaves just like any standard fieldtype. There are a few default options you can set for the field, like default map location and zoom, and how the field looks, but there's hardly anything to setup.

Field Setup

When you go to setup a new Maps field, you'll be greeted with a view like this :

Pick your default location and zoom level and you're away. You can also change the height of the field as displayed in the publish form, and optionally hide the address finder input. You can find the lat/long for the default location using this site.

Using the field

On the publish view you'll see your maps field looking something like this :

As well as the basic map, there's a quick input to help users find a location if that's enabled for the field.

Just drag and drop the pin on whatever point you'd like and save the form. Nothing to it. Usage within a matrix field is exactly the same. The field stores 3 things about the map state : Map Location, Pin Location and Zoom Level.

Outputting on the Front-end

To output the stored data you use the fieldtype tags just like you'd for any other field. The simplest way would be to use the tag pair : (assuming your map field is called 'my-map-field')

{exp:channel:entries}

    {my-map-field}
        {map}Sorry, we couldn't show you the map{/map}
    {/my-map-field}

{/exp:channel:entries}

In addition, you'll need to add the google maps javascript somewhere on the page. You can do that simply using our helper tags :

<!-- Include the libraries -->
<script type="text/javascript"
    src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">
</script>
<script type="text/javascript"
    src="{exp:maps:google_maps_lib_url}">
</script>

<!-- Include the Google Map JS -->
<script type="text/javascript"
    src="{exp:maps:global_script_lib_url}"></script>

For more detailed info on using the Maps fieldtype, and more options for front-end tags, check out the full tags documentation.